{"_id":"@react-ssr/nestjs-express","_rev":"818-971182301b9924d7624268b2a1edd056","name":"@react-ssr/nestjs-express","dist-tags":{"latest":"0.24.0","canary":"0.25.0-canary.2"},"versions":{"0.5.14":{"name":"@react-ssr/nestjs-express","version":"0.5.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"84eeba81493739dcc8e8d766a6dd80e13b146e29","_id":"@react-ssr/nestjs-express@0.5.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-9bwmfUWjYKoIc4r1iJ99nS79qrkfU39nKg87XLyu8BT14U260u+rzmdYpWqbfbi1ChjKPOF6NAUF7/pNqbUpNA==","shasum":"05ed63c0ceffd984a2176ab92b23e87fb5b86772","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.14.tgz","fileCount":11,"unpackedSize":20273,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrcMnCRA9TVsSAnZWagAAt3MQAIHh+UAss3B6HvN7spYf\nbxbhU0nVUWSJZJXqG6GMHFGVYpMyBHTOIJ9jW3nlijEkKah1yWPbbmXPw/95\nOxaEX2/hysYtJ1NUygB0XDmWcpl0IAtG1ddcUH72Wid0p6xyNt0uWHkKxwnu\nkCIm20N6cloYIKLpdXjPbbfXWGSdhNLn6R8GQtP0ehpyLUEzmZr5WCG4FRXA\n9WNtVg4hPo83Mo+Ndpr18JuFymIn71CAFfBFNrRnPF+rJnics131T+B5eLBv\nX4eZ5AS744s9DaeFWwoPirAJ0zNIXH3QV7r7FIb6jx4I8Z/2ZJQCrbLsCSf3\nnwDhVa0AEL18xUQyB/9xCxZi5aTcplZd86fM2DCCOklsrjRx/KE1U6TO+dQE\nJJh+Ei1cphfcsTnSyDfiDV+szzoJ1LScdfCy4w4zB3LvcOuJnlRGSeIKokVS\nEtmkcF4/4uVytdV9bTZX4H4rClxeHfn2ZwKagQe15SH6w4mbzR7dl3DOQzsd\nE88iZeuXdViVPnuJvUpx9bZN69y1my5ChjwL+e2voKyrAZJUdfJ6iecMG475\n3q/CjDSR2rX2Zd5UlSEz+JVGLCJ+N1frugziTazO3l29mnOjgQsqRKBoPaML\n+nIMugAG/F9C/2l9m5o+CqBzUSb/JWu9vNH6Pjs9Pd2CBNd6iRbutTF219jw\nYY0C\r\n=iU8d\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDJnj0AXz9/HONQNlu7BsPftJbNJIakxN5d6VUxTjGdmQIhALiIU8872xRZ9nLk2dT8eLzT9F7V9Ru6ycJpo4mNoJ6q"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.14_1571668774317_0.35801531675192066"},"_hasShrinkwrap":false},"0.5.15-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"89bb81e181a4363e6938c812ccd029b1aafc6ff0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-be26MOJDSJjdHq5hSG5kFjQC3zuoljTmIjDgmSPS4CmxRrXZe1CLFcvaey9b61MjKOCzk524MNC/w9yejGrutw==","shasum":"57cae241f17c68338668e115146de0a388eaceec","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.0.tgz","fileCount":11,"unpackedSize":20222,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrh+7CRA9TVsSAnZWagAAufcP/2AgcuURA5DTwSWt6M/8\nJWa5BEN16DlPCzh4BSP+L65l/3cDl4N3LLO7Kpg/e796n2hxTf4tRN3qJHcg\neJHYwyHLhwvrHe3BzkMVeQw9TUiSreaulg4UxiwZO9Evq0mYRqkutDbi8uhw\nybYFEFfiqF/d9ZS9KMwCDy+Q+/SxE0fKMgUuFx616+kBr25itOTMB0acKYj2\nZQe4st7SBw3grY1egKYBk36TJH68LVW+RGZkAAKQ4NTMSeXVoGYUdw1zsNq3\nfgfXs2RYsj3u1/fH1rVaI03jQ0uovdp7bFl/+MVFGaPzx8n6jE0sGvIg6KG/\nDRlbPGVix/Tk44Wmyb7pQjWNjxYoCYBk4ZfqXlsadXlECgYnCoTIM2W29hBp\nSahME3YbuRHYRjgxO6eyl45XqWu+Vv+N5T5JH3EC14v7TfD9ByehtQIYPCWL\nR/B+PxXU4RebYhExkoeAtF2VSs3XeKgt9FRy+2h2oYs8ZOXO1bmd1gZXQBMS\njMmyDIUgh/roHa8EIX1VszfT9wuRhqJypedYx/cIaL69mjBgK/w3NRYOYpzW\nq3FhpXNbPpcHxbhQhPX4r5WoNYFt0zllmRTBv1DZ+EF30T9yfLjb97z0ULdC\nz5iy0729czGZqF7mYbo1xY5EchmQK6/HZq2wBask2JYiLeENVueckg9F4HZg\nu9+x\r\n=wq/x\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIG0EW9iSvF+Wp/9bsW2y8gB/yJJUsSd9bJz2+tGQMcc4AiEA02Dy3XZbVjvj+XHalXkxdv3ZIKkhi9m4uIRWNBGvFGo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.0_1571692474395_0.16552706040034848"},"_hasShrinkwrap":false},"0.5.15-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"a12ee965bab8342585c22ca103c3068e85b973e6","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-PkqUZTuuBdHz3n8KBhC86JAoIZaZJZLxx7mgQXfpWoBfq+50SvIkJyae5NiktWaQ4pOjyyNWNuPGj1QhG0tqLg==","shasum":"8007f8ff40e21adbd7977c6ee0ca904967552f1c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.1.tgz","fileCount":11,"unpackedSize":20239,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdriCwCRA9TVsSAnZWagAA7u8P/11osjlh0Cd0jHbFapmd\nQXKSr4aO381nVVDOTiYeT0w53bDbGuD8KUdsoXSCbRsJ2ktQNTgS10x2M4us\nF1bF/BJ7MVVuFDwPRlJMd3uN7gEdjy4vRqjeftPVGM8mV2w9zynqR+qbBFSc\n7lJw9H0FbDJ4QdogKYDiVD6QOnoCzGLbbedZtMMpUliwUcIm/mWdKoxQa4bI\nczal6jKxwXga1Nh6vviUlk7w3WqaiMfYqZQpNgw5mxZ8Gm+Afv6+2YPuZsEW\nJrcZAESEEXIerP8eGEDYTy1OASN1s0x0ZxJTP7R48/G3UmH5fpdugRYswTB4\nW1f7WRBn68Y9LU0mwdrEHRr9jxJR360CtDmfiBsG+IXgmd5YjsrGN8nixYKn\nVovWto/rw3GAOWw3VwSzJbpqw+NnOIHWJSDkA8AlPoWIQ9zOwEyp0Kpdq5sS\nxoPRAw9/2kUWBAo8r93f5LukGHDsb5iGGbHFaGZF5ZlFZSoATG8f+ATOmU+Z\nbVOniBDALxHExXl7xintiH+Hf0FfpyCBvr5V1H/uVcXQk0dShirW/gDlSMSF\nmOlcqYDdGILFJy8KbOKPPfKDx8Bc7S8Ql6EHBsMgU3GD+9jif8GcQ0YIDPdz\nvovIKpj1dPsjjgX+6D1HGkN3dV9ah1e2GOA+Gen867+Tj4UuGaCQ+KveEGP3\nz016\r\n=ASJX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBG/9qIi/306hFwNWc4FcreCDU2nDRzFLHITOXBANjDxAiAXcYutuyKk2PCCev3Mz4KhKUgSDLHiH+LoCXOpf9gaJQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.1_1571692719416_0.7992231962372276"},"_hasShrinkwrap":false},"0.5.15-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"c8deeb702affe52318768b4d696f13382888b528","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-xvu6Uh1kXxgWzykTuyWfBQkD8s5l2ytWcArJnzC/2wk6UlrA9KupNGoI8KRiZsNSS5Wz2NJM0p6pSPpuKPVA3g==","shasum":"8f2cf247f6c9f3e0a9cb770f5e552b18cb86389a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.2.tgz","fileCount":11,"unpackedSize":20253,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdriGTCRA9TVsSAnZWagAANAMP/0vtPpH4jWYJ+pdVxpiV\nq2m/46gl5Kd0cI/D1xQgW+fxETtKRRBmM8A4jgEthRgSD2blz7aC6/1GJ/zG\nx1QK7Jo5PJBZRzBDcfiWG8lNVD9G8WvASB92Bayj/IJSo2kUCnqJJlIt96zO\nfy4AezQvwx33x5NVfaJqITOiMngh8Wu5eQ9lstsf4I7lzq4cSAug1+4oJOin\nG0pMt7NeDssk1InPr6THIMo8dUtnUuj7P/YtO8SLDUeuf5gEi6Jmzs/6JXfy\nucqoBhi3tpJ2rHtHZ85vv58RuycWf2acY/sTk0bp6Rqd0h679FH76r6Q774q\nNFVxu6Ipzq/s2oo9AUF1S55P53Fw0As9aXLU2rQDPhhAjdaPUBLPZE2cEJhh\n8SGeDvERTbHZqpQNSuk8UudyR/zmJG6lndRDNYDcDvfHprV6TZONSPjFsLnY\nxIy/Ve5vdnDMs6/ZqomVcj4D+C4Ob0Fj5bSg85Ei6+gLUnzIx/xHmVce1ksy\nnQh0ourjRIctjvk6r4JQM09Elt1YKA4r8uOeTql6rzxUCWlLYkw8qbHi/Ozv\nfKX05NBDuDBf7ig+7Y6iPLHgRKGk78a5hg1wi/mI1cGtAQcqYvPqJc52J1VP\nNN8ZBU06H48aVB7lfFOba38MpgzvUkx6Aephi+8xjSa/mMEOeJ6VNQilf5ZF\nmoLM\r\n=9xAo\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB36y+gbaX2Hlb7XzdA6dI2DiCITJL4cUNf6ubJ9a83MAiEAjgFXHkTL9kEUFXnLT7WksIRaM5OMKC3OQHoLCB6n6z4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.2_1571692946663_0.28558611209681395"},"_hasShrinkwrap":false},"0.5.15-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"0a029b49948a724d08bd564f87680b820fc486fe","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mIr0MidCa6ArzWymSarc2Grv7H7Q+Dd1HNpGUUl8cWz71tUWPHm3ZnJd78qzo9RheoUUk/1tJbw8zxNEpke86g==","shasum":"40ea2fa6a166763840e1374ca55f176945806ce5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.3.tgz","fileCount":11,"unpackedSize":20267,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdriMpCRA9TVsSAnZWagAAePUP/0Xcet8m38xpKLimToVK\nuTPoJLd6Qj7RONI2FvuPWEVg/O43m/tChh1hd3PtGwLl6DCyYil5pMgVGrT5\n2tLMCKV/mQjQkWYCu6a4eolMKg9h0U2ylWltaps0BZBNfQregkN9JK2oPWb/\nAQNsmi0G0T3K3cAwThGu5ZffAky05i96jyx+qoriqyM7d6vqLNwgYqB5YCR8\nyZKjRIWXCXBuCPt3rviSqqLE4QUZqNTbst/OWeFBCVINxeAKl+mQ6F311WHA\n2Z70pDADBuJvao6yczJV7mEUTpkZownogaDPjdUW9YCjmpdvDfYBzofOSVkI\ncYi6lzQBRbhcPcMouLSdOv25IeX/iQxFSS/jcd4I6Su33JTkEbbNisemq7SO\nunFQ4+ycdRJXGDhCJ51/3+M0ZDyNY8jovw3unQrIj8U7yfm7I4Nm3nnxNITK\nL7pFAgCpOb04srkfVq8eAwA70Yamlj4Gmqin5c4siMpn3pYqrk9cn5ldoncH\nm5OWJ+N2mfi6p6QGDbpfkPzRf8ODaKOYeNifJGwTcm1t4CzIE270KYyjhvg0\n2sXxCnUIvTwyZgAt74LPaf0Woh+d/lcYNR1Xj7sUbH0iDwZFzjhGixruata/\nKSuoxoI4Hu1y+RnN9gwtK2TxQsS8a/DJ9Fa665V7cUJ8eozUYirm0L1nuvuf\nYehv\r\n=Hx91\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDPc2XDNWC7a7E+DjDp3XxGrcEgFi+9q49bwms1my0rQgIgfqd6tzufQNb1ldmQkQrjtNvnj+Gkxos9IuxN3V/fFgY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.3_1571693353100_0.5002643811192937"},"_hasShrinkwrap":false},"0.5.15-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"2911f91f1be0fe150b0ef5e8b2ad3fb764e04a0e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-nFQq3JJu+fqmIeV/xf+EaTy4er05MqfoY1QqfX8UwO+ZSuw+im3D9rMBgOXyeK2k1t+8gSCiuP5tf7UfYoOisw==","shasum":"8d767f44cd016bbe3bb8432affb4bcfed8b19e79","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.4.tgz","fileCount":11,"unpackedSize":15609,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdriU+CRA9TVsSAnZWagAAkC0P/2NGhMZHqHRRatDPE0uk\nAol2TykKj5KyCaoA6Be6U53QJIZv4X1UrfpMMqHr0CdkWmvkeEwTB6Gt61c9\nLrEvjqGtOl6wzq2dZuUQ3DDjbSGUeH0efgstBCV1anNtOEkuPEkN44k0u+5K\nMZrmfAvqn4TOjoFSDtNVTBesCfQogp/y7H80jcIrrxYUOylCeOahYMeWMWon\nTuqWYTy3Jfde886AKdhj35p1Ye2+FS0RT7C5h9Cr4Yn0gb1PqZyCH2BN6CBc\nTsl0le/FZIbXsEp2eu004X/ORC2D0aXiJz3xq1RFcedxaF78yXfjP6uXq0N5\nVMEaQvWGTJjS+vVA8itdQBYjtnfXADGUeOKGgW+lcuObtnrPzsR0TxO9Q1d7\nhIgQO+OMIK3tOezhf7A9x+8rH2k4uH/6ESfjrVxXrpfuaXxciRICMoT7wAyA\n+y4dSuhaFM40F8+NrUrBoz8xwalrrAxu80b3gRuHnMlyHhJwPa5m4Pblumn7\nIXbVQJUdMwcevJaua4gB8zYrZ2/dY1dagbMfbc6gkXKEwRi0mprX/yvRzSUT\nHq1/L4g9XCtOnIb4jjekVjZ8/tVM4CwUWq7sEHahT0nS4oPy81pZNoFhFwqX\nNRwASSLhhSu/cuCRcTW1Whq0CLJRZh7dnVValiWOitC3vRHAUgcreEz6B4LW\nTtaQ\r\n=8G9N\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC165ncl8XnRUWo29sGK6t3pyAhjtRoSwRy8tx6FSZjjgIgaIRd8l2oZUgawvAQ0ptPzwpemQ/MdVQDfcnqU51oyzE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.4_1571693885739_0.01671767777547717"},"_hasShrinkwrap":false},"0.5.15-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"08620681924d2f7eb18fd521733f1a1bf25aafff","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GBpA7oDVEieCE6+XRSl3b++PIHG+o/KssuW+Swe3xYwIR5Hxgm9BV8OhngjwzGS6A+0N1J40a8T5H0mow95W+g==","shasum":"2dbb186fba41d991e5b3eda4778643bc3deff411","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.5.tgz","fileCount":11,"unpackedSize":15590,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdriV/CRA9TVsSAnZWagAA/TwQAKPqzzVc86j38tBQvpN0\nJXlfPvPb2El55P4XpK0IZk+p63+4Y+oOcjhm3lGvhC+BtIYzNcKp++4sZaS2\nFLAYc46P2BHEhB82iR88mhIN5vC2i//OI02r4Ii2iSMSJmdgLEDUPFilnmbV\nH0n25HAMbyftDJ1wTiOtsSeNgtPDVSru6CGpZqZco4XFZwGF93uCbaLbG0+k\ndzbF1V7mL5tJ/TTx2GBuvSymOyE8Dm5Af2v5CI5kx+J1J+wn2JmtXmR+SLMw\nTyAnRyXtg44pnCtebXYVO5HpCBhgVr+lO1xn8I2Ml9NkH60hmtN6df+ly+/d\nDbSJ5kyhhsV7Zx4zxgss7RuGslj8H4btxK/yVYtS5TQ+AI/ryRNQApkaRtIM\nWUr4SHMbe9HvyHVZEDJatko8I3nerwX2ZZi+aVh6tYyg9yKQ42vOZmziUvqa\nQeakRDkTY8nuwFixBZcYi0bFCSQGg/5zeqsD9yC1irhy6RTxVlpPVNVFWpk/\nR3CVfePB1ePBje42bmjApzMRiAXFqO/IHFtDdlWtgR2Dx24RB37aK4NnwaoC\nhu0C7l35BpKUSBywq1UwOwniY66sYcf06wU/UzOMRi4oYjR+80clRx6lC5SN\ntr0w57xaEsX8Dx3Aje6l+GygA+7xb3ip0gJ/Ls5e09p/k2VUGHjmejOJNo8C\nuRCY\r\n=Tncb\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF0ueYm6o0+kuzG/d8Wm3XaSElUAU/VsAJbp2L/cIt3NAiEAq/JrKeGlgMIE2Yl9eG0nkA+1+lWDOO7ixcI1C1AFMw0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.5_1571693951362_0.0757874225588322"},"_hasShrinkwrap":false},"0.5.15-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"87f1dcce0d3307e4fffb7c15d485bf8d529927a7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4hy1zlKp9BzsBMxoYpF8/Hz0SPNVxh+YLr90dJ1ur10cG/eGpTNKpaIZihNXNN8i8PL7Ln3iXkCPGmywjJG+aQ==","shasum":"dcc278ee72d2299a734d33033be657e7aa48bf7c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.6.tgz","fileCount":11,"unpackedSize":20292,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdriZKCRA9TVsSAnZWagAAXwsP/A3kr7x8jA5FbuygX0Cr\nxGMVjsr8e9GWU4aWumXks9S3fwUwdzNEEBJxZZ4/XABXIoNdIFXQ6wkEF9PR\nb2TA9U7USAIZ7OhCX0b44k3MxgFU60s8RjF8rdlpPbFfZKayc3PEmR60ZPU/\nsWL/2RLXcNcS4t1KyWqcRQomFSjaGjNk4uLLPWG0EN4yz/36kbBsVJc+sf/a\n0ksMF4tQr2ObygyUjUUcp/PzIh9jkH1IkLuZXm4gFaQxlDl/eFV4zcVZOzyI\nlKtRn9v46fr3gRYH5/fiZ4Soy3IXzc5HdwkQdZJ86tmX9wEv/oA/jr3PBVht\nIwvV4ki0htC1dAmB0TAHNqkpO0VSi4YMHW/WVvmps6ymb/CafRI4OVavjIGT\n653EG5sd36Hb0EG72O02GBiS83z52OxDAntOLHDUymLXn4ufXDUfV+vzpzoV\nhaaoSCIKoBnSv9zYeVQMBbTCU/pwtrdvlbRLgcR7NZvxJmBx+9Jcv95la74Y\nFZ/8aUvkcpg4voRx6aVEfKvFUHSgDm5Dr82lB3f7B2zpTtJTHdfn+0taX3q/\n1KBYv7RctfU3VRnKfuxMPlFWC+KDd/4GMAILlbRL5ncZOJz8kjEg+aGE+TcS\nkKex4YQ5WHArV9/pCC04P1DDxzaNhwQnZ6+z5qGX1Qgqa1bz1JrnEiob+ACe\ntLqN\r\n=p+64\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIG7oeR+Ey43hu2rrcOmvvRNenZIcruQF2soILhgsug1tAiEA/x7Ntoi99wHC/WJtpPHd/ikq3xZPBdEMRcFheTs0ZNs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.6_1571694153540_0.2525811643511042"},"_hasShrinkwrap":false},"0.5.15-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"68672f4a402459bad6d3ca200d503f4f41823d76","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-k2tuKU1+s3anNSu390ZE934twpr+VeYkgA9MhCUsYg5xXj1JolxYUbom+FgqVyeHDDSPC0WlHDGxjr9ahPwYLQ==","shasum":"549bafe14e170aa606ccae7ee893d4ad0786593d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.7.tgz","fileCount":11,"unpackedSize":20321,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpWHCRA9TVsSAnZWagAA2tkQAJ3sIDHHstNTZGHKbvdP\nQITAXcwOIlRz27kNdf94DAkQkg1l4WG9NivmVd/Y5Ce6y7usIhIRLpgx+0nX\n9uaGO9gl0a4Q9U8PoXk2gZc1xOapFNnL39SHFCpcgibSWSi7jAaVqz0DVWW9\nDyqDWU0QKN0gnvrnBzsNeq7hvI3UT4gawC1+Fsz5ObXG7tzmIvXRRkn/cbKP\nADUfB5dHdDthZ2/Zuw9/5GrBlhKLn9l/JhpbS3QTNwBDVFfAGZ3q9Py/Tdwb\nINI3xqxQ/2wbntWKiJvqtrFIB5mHc3YgEroHq8Ghval9l9MII5QRY6hucuDU\nPItjEzpTQmamuJ5PheXfxhhZvg9+PdvT/yVQZMtk83J2aZRcmvKnaFoCW/N1\nl/+TbeJLlki7Rm3uZlBxftIvyJqho9JkAhafWUUg2rdAzM9oVgMJvI6KhJGk\nq6U7HpUjVJR3QHCh3yPRfuXXzGZg8RHqa1lQQDKvxZZhhvdfSKM7tkmxZp1o\nLtWJdfdYD3hj+VifuGjUrC93VoR1946wjNRGJN0Qi/ctKfmfWxzCYDDosjn1\nuvgr/+oGz+q5oVBDZneERkz+I1tBcxr4Yx4UzHezPf90tHSaXt8YPKl8OZTV\npVwgn6ReJq3m2GVR56fHvv+bVUlxGPyqyrrS0gcpCUu0VafoigbyOXFermWs\nlr52\r\n=VRz5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICOse27r9CuE5lhechOUGa/pKCiiD1CC7Qso5hqGCgBhAiBUP0Y2u7Jwhs2reyFdUhmRmTLitvtzeMi9V5MrnrRrcQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.7_1571722630821_0.6964251679323867"},"_hasShrinkwrap":false},"0.5.15-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"9b973ab34211f03c6699fc87c253651341700464","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Lbi7dT0qvYM7o7X0ZqQlTde9xUaNSP21rTv+p9syjMA9YfVve6YI6gduRloLbI5qpXiZ9rqjpGQGgH7j7m7FNQ==","shasum":"07d50418374d4902153897f1d2c32426746218fd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.8.tgz","fileCount":11,"unpackedSize":20309,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpX1CRA9TVsSAnZWagAAZWAQAI4PH6/TcoU8oXhuM0xp\no5VgwmhSGN/zO2hBxxJHrefIQATDy63aSBPlKO22a3dvyy9SPjHKOvwNMCjA\nVMhLd4GAzD/EftqkEPsRkMR0E2EeZU15dlGer78cGJHu6BUf8KqzmKbvJn8F\n0aOY/IxETmy4VVlIM/UVhrx6LoQPh1K03xM9QsHTa5OoE0bZS9oED3XlukAV\nNOnGwiEqQ4v1jT0dSrNGQxXpLIat/TMN+TCPBoP33hSDP0KdosDRWwTSS662\nHWDtZTImGPEG+AFpl71Gtsn2TDKuffw7crXJjjKF3nLJCGqtxqssgWNT8TY3\n/rILvDNj9Vxkn1IFpzjLnVZeFIEEz9uN4/tyce9PyTaHYnR7VCe/56gBifwh\nVn7ri+aUl8uIUCAV2s3UdYtr5cbLNX3VR4SKLeDr8vxmJ5PlTolSke8pbone\nVvNMMhWKNRLZQ8KjOJ8bO+S4Z+VGrg+NxUfF2SmX4cozRIIXH1bNxcqSPCYe\nZ9DfksWGtgaV9wZTuqAR6kqdpKSBQeNn2YM1iqCgFYrMtAzUHfS0dDSCYzwc\n5pXMxplSQFx1u1iJ0ROsOtPYv5bi+Vx1yCe+Oq787yvDCvdNY2aBnXqPJ1fo\n2gEK79/+6mRcSsJTY80uYi1x/8AimOFtAeCjNKQKnQ07Oy9zBHn7cB1w73eF\nHVM9\r\n=7PZz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCYq85HVUilO/GeIjUNXgWF4suUKC1optjAueAPatorhwIgUkDDAi0B7rBfOzi2mdsojZ1VWeBnGWw81PQMc21MSBk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.8_1571722740628_0.7049196147208416"},"_hasShrinkwrap":false},"0.5.15-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"51d906d69d69f56806b74477ad1b04af76d9115b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Gn+NCNFI0cbGsMCis7dKC/xu+VmtpU+J6vI/yM3C/MJbJhTNZUK0ZZ+PrPSPo5QjQtm9qtiXWkkUI0QO5uCyyA==","shasum":"a9a9f1797fbc64110833ad2c5a93adeff341a9e6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.9.tgz","fileCount":11,"unpackedSize":20324,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpY0CRA9TVsSAnZWagAAX4QP/isXIyVkCaSSgPWaOXEx\n2V0EShkGz6RqDTSeL4PQz0Cuv8SsJrdPnUYydckqy+GDchLwLS8/P+GnX0AE\nwoLENtBWCvfmfdaKOmsDdzjtRRtbwrDAG0S0lhQiAuFj1xcSGNvmEp6pPfxd\nKglMdCstqIMqxe/jNpCZ7Y5EVNJL4uMuik+jSipkDv2pDmkqx1WTgCwCWXBC\nB8vF8fAYFN+AO5Q9/3QvlTU8+FaFDQYwVMux5HlW3GbV29Ds7nKoO6g/2YpZ\ndbBDM8klFsjju5bYq5AUoen0RbGzkpG3BYjpHhdnD8qJcren/GlRIkljC+IM\nB8RpoUOtu11ctQ4EfR998Cc/cfTxromXzESEaBvwsDxUOhW3+S1Cxjr7KuN7\nK9XDEHsLCD9EB5iwllmxNlx1UgX3IIs5R4ouIElTjOA0Xj1kEGJQdavWjqPo\ngNYZYQrG/Iaoy9QkEp/vrnqRO6GfepNA7dzigdYguYGR6hdo/UHkCIwYQll2\nOTSMlYhDm3OWCRWIDObeZQHfuC91JNWtmpNdtFIypN786kzJziI6ofemNwKY\n3M84eKOaXygn5cIgYDpSbh6cNfrrVVCHLpIJiPk2gBDlsyauCJEYszVMKwHt\nfHWuBPFgQF+/ARsVJeqCHMJfIWpdL5E8d8km+x1j2uk0O19gtLKXZYii8WEZ\noWrj\r\n=+iDv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC80jCDFBe+mxcTZnbi+mnhTYjlHWj1ofe6IgFBUXDmTgIhAI7Ypnu1cv0pxd3StXp6JIJ0g1n0eAGb0Fr1EmneLsFD"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.9_1571722803782_0.655003287418132"},"_hasShrinkwrap":false},"0.5.15-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"21cccc47d26497a0a494b94bd2f22a5d1364468e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-O+WngQCZJ6UQgXL4vzhGBTbscT3hMDvSZ7gshUKwuJXGXInck6ElsGPtLHS70afIIqsxyqbTkBQyeAo6p0+kUQ==","shasum":"8332713e25f0dad5493c5850b75eebbf47fe9d9f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.10.tgz","fileCount":11,"unpackedSize":20451,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpaHCRA9TVsSAnZWagAAqjAP/2gGlbYyV0xdl/IspJ6Y\nE631M/iwp7VlfgbMJ2T2L7waDHER/5J/Nn0RxamyRVpL9R02nr/8G5Hc5Smv\n37j2eit1yaP9zoAR4RJeAIy5w3GsZ0VtV90dgt4indvJ9BUyZ2pkpjCEHNzi\n55nJgZfqMwksYY9gX4Qmru5CGPr6e7YmK1Y4bAlT3fYu51sFCc9hN8R6aJzs\nu2xUHY2i68GzerEGpfK1BGNPO8UeFtaVIh2a5lexUUCPStn51OoZXXe16ZI2\nMqRmX/zSIGQdHLq7WNXDCw54XoZvmzsMoyOHaEMqT8Fibag0fAFOT3lNLbZr\nzstrXs1BoyYA2REkYvWzeTP451fex+UVtQHpL2z7r1lfehsNZZ+Ct6GNEeQF\nXQsavUv8OKrnpLuzg0v1JOjh8TgolLfTtbeIRvJiVh1c27c5tJrItmVuqSJv\nbbFCu0snoDK/Y1Neu8/XcTW9QhDHWJwXHuXPAwNDJSd597qCoQuxAUCbEKVF\njSPMS4gsq+k7lsubR7HM7WDRBZEt58NhGAL/6AAtu7kIy58OwLUXEjyiCug9\nfvCXpkeLZ2Ud/C54GFfCtB+PjeALplIcPgokE9tWFuBOBkmOuzN+HlO2oKcn\nkmuXv/IdDQnxKOgLk9WiTHlTUkicbLjJPiCzQQ3X7g4lG0auU7dKqg8OJa6u\nc3fJ\r\n=Igqh\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGmKuiFRwbnLefCEvY4w3sJmzQ8VBMO2ks7GjxwmWqLqAiBWGkytYbZPUzLoF5GDo+uId2tifP4QSfx8XPCYbv+kuw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.10_1571722887210_0.10701984440554102"},"_hasShrinkwrap":false},"0.5.15-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"7a58f6811e169a04e537489b91dbfb0b11e65040","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-x9NAS1tWC/I+GRcYPvzONjZae4yE6hz5yUYEgY7FmHn3EspxB8Sizwyrra6iadeVmeQT0aCbNhfa3khLrhhn6Q==","shasum":"1bc3e8939f3a4078a7c077c60d2652f6e70dc94f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.11.tgz","fileCount":11,"unpackedSize":20443,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpbHCRA9TVsSAnZWagAATKUP/3LaREjgAvAQvbyES1dz\nAoT51ghJJ8o49rGwB2oYm/2PP2XQRXOealoIIZewVImM3ZsQhNsh6ewhNE3c\nl+djDjPYQYkD4C15XLFqw1wxY0kMyFQ8hEvD0m7NTHmJ6e0cGPZeQpCCJe+J\nubkfWy6DHf0mml/0lPT+qCluxRNrWzetyWTW8a8A5Aj1i49GKtdaacjO9OXV\nUKQPeAF3o0NiDL3Hzxk5Qgn6NKdzkNJJmT7UAjsT5h7H0X2hRvw6CjrTelKl\n1dae5/7KIAs4/N5NOBS6JRMJijk9hKKqID1lo9EeAuF/dOKSp42mqb/alRpR\nzMnHZY+5pPiFbSjaXAJtZOF0QiWhH0D2ZabekCj//p0FKeZ+MsmlU/yVY6PG\nI8TwGqEEp15wCXQfX8M4Zgo+/vInnizkBcXWTJOE8DLQgC4/PAzDLFFbuQMR\ncGinhusbBDli6nDLonzj9Q8k+TuCaYGWT2i1luM2R0uCw8la8a8pj19sDo74\n06mKSjhlj8/Ixr/mXLry1tLhT2lhOJjplMm3XVJC3CyvBvO5gSRQsqWdufSs\nOSUKtRLUHuoO9SPwqOhxUNVk0kURp9N1Qmw7Uv4JT+NN421BYpUCM3I9e/ud\n7MxVM10hq5yy1wdd6+rbpDFGueBH6prUlOCEixB52HnVLml4RkYeesnZRtnc\nKyKf\r\n=4Hdn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGfFP7H/oPh9/8Albch8KyUgoXQBnf4LHlluupChqBIjAiB4EqT+G1sCz3jnYH4CV+LJrZRgoJcgZ3vcTHe5ikCJsQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.11_1571722951049_0.14922626512820125"},"_hasShrinkwrap":false},"0.5.15-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"b9ecd92046fbd99cc05180a150838ecf3d34a9f4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1ztOAHr5q8fdM9C5+k40bCy4Srlz8d3B9MyODdjLgrWtuZq1phLWdyzLFIOsI0Ge2Drio/evBiGGNP9MMXQ5qg==","shasum":"8d3c66612bc811dea17398b24d52f9696b63067e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.12.tgz","fileCount":11,"unpackedSize":20489,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpcwCRA9TVsSAnZWagAANKgP/0aVWlE61bdcciXZkIVi\n2AXilGoZbk2T7/hTcPlwKsbtt87Ay2d17PGwG/dGMKxrBJNa9hORjzcMbccP\n6Bd7cuH/FBf3BV/+vj7uEIXzQYmgMF5CzV3XguRcKZeecmvztFvu2qz4qesG\nk725t/WsA6C9ZKokZeqlUJh+z/80xqLDGbtOWOMs21UMramhmrR1DEwgFNUT\n3jp+ZMEyJZvf6NM6URrzE+7JNz0oPq6Z2hmfQL3/qfwkbLXpicUNl0h11NsV\nAbcnGrmFg6um05sFLgViU31lF441jf524uYuhhu+7aMKJuyYKyKNXsh6ADcc\ng5xR6TJMHY5GUgtRuqkUxpvcyXxWUulu4xSbK2EqO4ooMUWF5QJcsGH2uz3f\nc5bId+mbqfBOq51KTS2cGkozGqgTiHJaRCcLUQZVhoWgwCS1tych6pE8XX/B\ngvRmfIbkgGN8LazXcLkebEfM9x5sF6+ExmP8P2VoOBlRtiA3ikcbdp/i71i0\nHVbDgb4ypT7ESlbFgJ3OnYvnREUraaMInAXM7huM1j9Wf52jUwoSWH62UKvF\niJcETEhI+1NekSElMaWdG2D1QzrMpdAZ9Ai6g5kuHcpSICfxKUvrjxVTfJ8P\nSZvEIIV6Br6P1O6edHrNhgHHb4YvG+Xj0fCW8Cpx7ljzn1VLotTdpRsvR6Ie\nzAfF\r\n=GSTk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICCduB84h9zZ7LernlFCcUkrsi2rcZUoRiBPx7nhHD6xAiEAqMKHEhnBr6hnd78ft2c9Qd8oZ9kGlxSMbNoAcNwkBIU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.12_1571723056384_0.2327830111482725"},"_hasShrinkwrap":false},"0.5.15-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"5901ee758c540ecd99ebd4d690e7f29aeffe38fc","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-w2bWZzToZMFcCQDzUJWF9Po5w8o0BgN+Nb/fkt1l5s8BVLUuSjdLja7ve0RDtlhyTl0cGseC5SvPtsMB8RLzUg==","shasum":"1e97f141e738bc5c31afff5358fa7d155ec9046e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.13.tgz","fileCount":11,"unpackedSize":20544,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpeNCRA9TVsSAnZWagAAfP8P/jdtZTb8xtVk4ZAyXtcC\nmMosl8sY00kglx9jhPCI3LDxD0ptpZqKr4DwTaufFkqySQVAQjYTqczp07IJ\n94hVQ8sbPHbP5t/04GwlWF2SLQdg2KgqS9OvhVBZF0aL4BArAladFRq1CLsy\nlrEEQBBcYw8tf8+4PFjPuxKZMbJ/XWA2naQ26dsuVcpuN715l730VbtkcKCI\neTbu6vtdfhpyXKI5aVvP5nnYO0DZTKxHcZP46WWgk+DeCyjmNiWSAYUSlhkf\nmbIv4sxAr4kTwpoLnMQA7IJEyT5oxVqZ2I2siO/NMfAiUshStoR0dVaxHFyW\nBbiKKEpwowM+QradZGFFk436gH9ezFftQCnjux+QZIvrPPlbqOdebZc4bW4n\ng0xtZmiC8C9fp/E5Pdjj7ZZFg6yEV1WgnTn40yaEDMiDnlI3oNPVcjQt9scQ\nZ5Qsv0UHEngxjkdBvUvIsapr+/cBKFVwV5xjot/1lDBRGvmGUpyam9N+kZsa\nRdGP8YUAVDe/uFM9+yb07B0FaWQA0H1HtkzMYhfauWvS67uV2AWWH3OpwNNT\n9fv8cN0X5uxD5btr2FyxZaMyxA0FmC8A66xjHALwDk2yjxYtFqEgNg9BYv27\nY11WlyEHfmcYVz+Z8tEd/ZXvtclDh3GYeGNkryxcp+5gawRXPMca3ppAsH4B\n+uwb\r\n=DyT3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGWUnG1iDO1oBtKyiWl2olYHUcrSgJh4s5kgirP4ZPgTAiEA/gWRS6pPCPLbyB3RzqBXC96AEtVHkOh3ChdFSmIJyrs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.13_1571723148529_0.014101522180096415"},"_hasShrinkwrap":false},"0.5.15-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"7cfb0f6bf17674f16f63a5708723d66876e23121","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cPU07UcdFWiOAZfB0DZgqwcN6PDEICeBQfrMfUi9fSi4k/fsHRR7L+511R0H2MiB61A/837aW9WoggHpzBxjzg==","shasum":"aedb8afbd6d4b59b7171e8b279e6de2735a81f90","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.14.tgz","fileCount":11,"unpackedSize":20589,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpkSCRA9TVsSAnZWagAAfIUQAIH9+Ez0xa7l7zxhCjuL\nX8L1Rnw4MD1Qx6mnNSOhzE60PZkgrIQgk2E7HLgT0fCtrAXan0SnzFW4dccy\nlnhbk7nt4rDvq/xyEc7BHtmXn6AtsSn+pM7UHZHkUJe+uKnh2E/Zc7lhKBi3\niadvfSXnYgZewM39xGH1wodehf2j50MjMt6vehU9QNmVEahq29NqGZXohqwJ\nxzcH2QvKEsAywb1wPUVziumq7Z5Mfj6e/q7J//SEfQ4P3ZhPwNz0Ic/48MB+\nOVyHl+gXliJQRkkUBBgnRE2oFTNsm5FQLptwVwiYgT3wRQpsJgvuYxarrSKi\nMWEQTvZwf+B1tEEA/Q9y2GtP4DGzjT3iLvBfyZcPACtsg8UE0HyKcbjkdDSw\nqDGy/BfeM8O1oRD3byqqVui2mcp7QN2+cHoKYpsZZ08eN5A2nj1HbIIe7QLO\n/Jo5jtO9SFHCqlZeRyuH27pGh6XjFt4hkcl9M+kiFpMJO3TiJb8JHvgVKZqn\n8PSd3nD/H3vzADukMPiWt4jGy5reWNAHx7gj20sVPyWlJsWf+ilbn5seM52G\niPtgEIl7r3B+pc2RWdDwUDhMWjV3wZydfevAkbWc3pPlXN09RCihx6+YtkXL\n1s7zRSIDi4EWYzdSxPwQ8Kk+p7AtPHZCKq/rhZ8alqIt8YpMc5ByFPaDNkiU\nk9qD\r\n=Frmg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEtgPhiC9YTzsHQ3Urwrn+NQZWnTTWQJ9x7Cjam4pDE8AiBRPJYO13aWj8VJfVjz7tsXv4H3GpMnEH8kth+06ppyyQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.14_1571723537682_0.8099456504814562"},"_hasShrinkwrap":false},"0.5.15-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"bbcfd061c171fa888c9197de102965cf3397545f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cFlF8eEg1OZgRtRHKJ/2reWGkdSgBHmawVJYdiTNVgte1bRtC1qCZIh1HQfAhEI4P5LMM7uIxP2BLxqbeXlAJA==","shasum":"fa86cc2c79336db3bcdc81d282a9f79d57e36fd9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.15.tgz","fileCount":11,"unpackedSize":20604,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpnwCRA9TVsSAnZWagAA/YQP/0UkgcdnvSMKlZhV0RdB\nFH9Im6xd2BEwMh6HgsApOtKGmI9La9TcFDbgP1OtNUFAsYRYhzQRhpCq+TX+\naztZ87CKpnoMeby9ANnfqhwL1nY326TH1/bknabNwtCXjFdG5fAZESngfKqi\nLtGjoe26sQE5Ku+yPubTSFh88XhrS4hj8YCnlRFI9AL9rQ+h2wflkfhTMQZK\nt/KKSnBNQZnHMm+zhulbHUf9qqtSsTHMgSuMFnTugw0kxhbcrEYpbOHX7Pu1\n5kPCgXc/IHUxBuvhm2jef4uJrxMsnQX515weA75MMsBwT4FN20iG7MaVesVq\n17mgvQmsWcjGAdna156liLOaGt7LaIvwOiQjGYmZ+it+FgEr7UNL1Iu/nxIC\nW6aAz4CpCBi+I0EQPnAaAU9jw79b18COJnWFyJLnvvQER8v7PjarIGud44P2\n58NWbQ5PhzhtQMBypUSXSKi0FW6x7kgd2aJ6NT2WJd31umGerLOyBzkBC4bQ\n93HPxzPUar6ib8dXge71Vxc9TxCVYJ9zOC6ADZnFEv4KkpwsEwA3VsUInmsE\nCx5jIoxVs9f28p5sgigRj5oM23MFFIXR5t7F0XM3mAZ33Atwh8I58P/m4NTu\nLFrdh8V3AZ1u2WKsWkcWmR1EMTZoGgKiMh1h5O4GefQ7XVD6YZxsRgKCSEi2\nZHmW\r\n=wcYE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCs2xYY15EJTELOlckZ4pWmAGpqSSwuSdrohKKsqRwP4wIgOMa+vNIM2s3n0sp4pZB1yLPmwfTagR/nThPJWstqgic="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.15_1571723759384_0.24719951372561377"},"_hasShrinkwrap":false},"0.5.15-alpha.16":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"cc21aaf8b6bf523b2db18b04d1a7e59cede95d5c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.16","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-vX03EEHtyePfdcBJm9yldSz/Z3h5PjgmiDt49QK3JdX8hpHTGmkrGwQppbYmXyswGD/gZey/q2aeH+ipnD4hSA==","shasum":"4a2848e1a2947ac4b746e9fdfd54d67da93eb14e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.16.tgz","fileCount":11,"unpackedSize":20635,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrprWCRA9TVsSAnZWagAAy1AP/27NbCW3kNmJN89KByhK\n8Cp6HL4VatPwrgXY7buZZxK3l9NNc9uxRXPIbMZhzeYGqLz9OSmtXCaakqnK\nLFuJbKWWTGByDF42bXlxheY8LwTGyrL97TZQK4aQFf2gKYV0TgdO8LnIDmIa\nkknYQ2aVADe8ArEPjShMNPsFrkyLrTshige5O/uh/mUPvk3Ji19XKQSg7W2k\nu/Vysvde8z493SIb0aOn+KUj5w6NX4yvK2oR/P6E4n0auko/vPT/0PYNMVvQ\nOFDi9UbvKPDspX1hvy8icKd+JjtP9F5rWcGXMWpbWYr8xH8sT0gs7fyfYhsI\ntqibvD00MPsrtgsV2gXzAGsFUHvnbFOc/hrn5MGfuZ1HWvSKFueP3HbQ7zic\nmG0EoFq3FFrV6VxxCsjhoWnYQQANeIr4L3V3jCS60T2wLn9cY8JJr6GxZc8S\nvqLdtLR9xfp+k8cNm/xEfmaU8qTIbFosAf/USsKN067gE6O+xwde2IZPd3Eh\nAKlajs3cKKhCQuG3guCHhBQdzXr15MmvGZ6CQFnGxsjrE3ZR5sf5BfGfUL8d\nFevp7WjZ7pNmATgWkulfD9IuzZN+DYXdRywguwWWstDwPoPIJey18KlWSduI\nrizpt8C2PvwazeGzBJwM5z6JfCf6nMHT2UWbubEP1GXknTdN2BUkTkrcsag2\nOZ13\r\n=EyI6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDrRlVfjE7BpodDL63BxWJfwPg1LuOWYEArdrboOMZcsQIgWhw7k9aGYoFTtKt8bmXNyXI09t9q4Q2DeWYbiahNoWo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.16_1571723989414_0.11874892092163059"},"_hasShrinkwrap":false},"0.5.15-alpha.17":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"ca937af591c3936c16388cc46c64e136b69aa7f5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.17","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-6diYzFHvGmYscpyNssv9V2xD4nVtXYVmbcpTtEVSZ7i89ZW9m13jti24s8jSXM426/eo+CKIUAz7Bk4lmS6OGQ==","shasum":"b2dcadf2ba0fa99d37cc6149eeff394742ecd255","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.17.tgz","fileCount":11,"unpackedSize":20674,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrpw5CRA9TVsSAnZWagAA2GUQAJNjHkbjyzFJlHBzewDg\n9egwMw3T5ibJ3UsAT3ncaICssuXcJ8Ts2AuQQ2P3ILT0LC2BKc6SeXtD0Xg8\ndTEbZlCOgEeNiCJuSIrUuIm7/ejJC8u8h4IkGfTx3rblzn9qtdqghcizfe2s\nI0SbXgIhTqxVBOwtMMQo5wVMgkM7/jgwcR3sZcHIJcmBAfOpUSarshajRpep\nvMb5ZH3GezZnF+Q5dVC03kUbgBq4DZUOWJHfBY2ffwgpj6pYAwwFdT0FMOIu\nvhYunk48jyrgKM5vlFb6tMwKAPdFBQYs2o91t1bhNJ9jqIncUxLfguGv3mMj\nCsNVmuTdp91eFsFw/KzAr1NLDiS45x8X1yFdt/SdCBk+r6mIjAs+53YterFT\nZNz7l2s/Jh/+2+uJygGthWA5EQGXw/PkD8g+uzScxBbmcjFcPu3lUZEtaffx\nHxpMxUxeBIkxUyHRI8L56RzbKW33IUsBCMPbEg59G0Fmyy4TnL/B/MCn892z\ntIhTTE0bQ5HzqIgO7d95RuubUbyQykaXrqkKEG8xr9akYoaPuDtwTHqI0XrL\na3xDvxrjeGVkvgoHrJ+96fiVyMhPcOtSL0HNPkAYw3K3/minzADQWNVrjGBm\n41v7rHMb1Vtef3AnzKOC6qV0UiBpMuPqQ2+/hhGl2/8U1BtUYbyfYKFyvWcw\nCBik\r\n=MQME\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGIgNzzvNhjtrPoKFGk8thOqpvXvU/hoP8m8tPTHHXheAiEA6ksh+kt+TdkZOjsfNsDmlazNbvmOh97xhniMyuPxyOc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.17_1571724344854_0.06842964440203936"},"_hasShrinkwrap":false},"0.5.15-alpha.18":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"a2229e5076f761c1dcf7726df8ecb3883d1f504d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.18","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-5S31ztpHSPMRiWi2xaIJ0M1f2ZNIvH4Yvski2F/3BUNfpnn5SjWuY+d2mjXSRXwQcOrt0j3aHQ9NOWAV4z0cfQ==","shasum":"8f63088b212ae494bd8354395fb3fd0c06b85463","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.18.tgz","fileCount":11,"unpackedSize":20616,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrp1lCRA9TVsSAnZWagAANBUP/iioJyhsonB9lTJkAPwR\nOSzl5eRHV8i6iBGfZZW9rQTzI22i5/IzPYldxq9P1hm4dC080U/et0io3OjR\ncZiUr7Lbm9SUwjiNSB3aa4DxOjX9fINOJCt4ht6RMe831+xV46lvh4qSoI6r\nel5kmiGVVvMzpd+tq1i+mIsxXX2i5Q5wcn1FNezX46FXApJSdgudR3+22IZ5\nqJ0L4tQRz4EHRqa23v8vg4mCoJ1cq0gJatQr7n+MLaX+2dv4IDIwFEJO/DZJ\nJD6IEVS2yaqf1enEtVLNMyPIP7T62s6Kz3ifHvux56t8EPvN55CLq9kVkn+3\npMAXH2ljde5RormZoss4OC6XzRlrScYKnBaYcOSJSBOuNzumyVVeHrXLeUzE\n+1ZJpYuO5r9b+b8SblQCWMw4qqUPxU3np/6QcpKhPAg4uQtwWfR9w+yNf/xG\nJP0739RoA5XZvp2YZDJYzcstKq1OiqUA9fZxHfJ0Zbf+PGMM7q1QXumAJeHS\nJgvEOGyqOUu7FgX1cRy8NdzSpZZF9yXQaj4sr7qPSsEoEQpY/UYQBmsxzurd\n80txEhxvSZBQv0Z6HzT8sF767G17IoeElpJGPlkyGF8lwRkyScmm3ZWfTLgv\nz3wvRT6naZtb6tAn+C+3F8qQprfXeel742bt1PG7fz8ezQ3P2zSNBD4890VD\n3Lch\r\n=We1r\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCbU3Uzm0WNv7N0ZWgu2WJv3dF2cy9khU34kp9zF/EWvgIhAIhct4e7KMZPTuj94GP0KQUF5vzKjaB1GNEjipIcrtzU"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.18_1571724645447_0.40487220371465704"},"_hasShrinkwrap":false},"0.5.15-alpha.19":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"c58f72b7fdba6d41d821aba473786de857dfd4cb","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.19","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-p7Bd7Q8qCOYzg1qJ5r9qcjKkGuSLJbz7qILuHd18AkT6OP3EDapKLa2Jnipa9Djc1JmVvXCDUXKMgMhMqmq2wg==","shasum":"9cf015caabd0e89407b542c3308e090e807f9c30","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.19.tgz","fileCount":11,"unpackedSize":20601,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrqI6CRA9TVsSAnZWagAAY3cP/0NnNuO6hwO7sd94g1Hl\nmDFshSFl60PO6jPmiLsBK10XrxvzaHyLRX0fg0eTAI68zXeeJjFsLLK6HrHJ\n88bGDag1WejthtQUznsq/R6WSLKyVQ82F7lAL9q+p2yLqFpqeNLI/92zzQqN\n0+8xtjuEVXCrLYVAcKBblSQC+OgHCMf1KfLKg6lx3+dVaU+11wbdFsYEYW2w\n5xjdEzhP7EgPcg1Bx25JAhP6aKeXykh9uJk15jN37xBIQLI05GTV9nl74oua\nEAX1EpqEotw+effBgCR1HogHKnxS9jQ1mHPRq4a8X0yY4n+t4OB2oKaNKBh+\nec00yF3CUn8GDiKjeMpY+qaSYL2taFEBQsTky17Ew5z7vLAcPLRN4XDKGAV0\nGUFwacPAjk57e+XuaeCeYqeKh4oK482349bTCaPUfOFYJTD1v1pmRhh5rosL\ns36E5Nb3ckYOyxLY0Imn/e+uLD+PJfnuXYnFdpz62Okq+MHaq7nCQ5AIBILS\nEy+J2kB/CbW1MMSfUDIWZzY1e+ptZe507tgaB2C7XANNJSumaerQteCuGrio\nSSz1COt8xiFJlXgD4duS+L9qrv32h5VO6a4TW2zuaDK+qkJiY4xsubwZwfZJ\nCup0S0sz6Gj/j45o92G0mIXuR77PiA5RaGSQfGu2WSuyqaVWq2l57fgKkOZZ\niPs8\r\n=5FEW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGV/WHwdHvHRCpUldgouLVFEambGfaSlm3bEIwKfDOUYAiEAoAHIGQgvyV5MvK1ZrJlnT39St+tBQRIw2Gs870EYNiM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.19_1571725881259_0.1959855006085527"},"_hasShrinkwrap":false},"0.5.15-alpha.20":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"e5a2c1f9dd7ea2b30bf6b6493b3c29aa439090cf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.20","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Ja8EuLdGwJoUtU8M87b9qidueQkQ6VZyKK3clHrXAevJDK+vUg4qRz8s5HRlYyraBscvAxwwaGCNZdDb35Y2XA==","shasum":"43e2dee2fe83c7a3c569faa15c4deca5ea3edfe2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.20.tgz","fileCount":11,"unpackedSize":20623,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrrWgCRA9TVsSAnZWagAAoxIP/3yhYXNHl9zpeAWr4OmR\nYGjVuDos8GT/Nfk0gdi4bjlJE7Hx/TERzn08pzIaX0Id03CnnMqmZV8s1kTK\np9Rsa7cPpmKD7HZdKLqOD/C3RaAE+7npqrkqMGJTX5hYHLwSZfN47LdA6Cy8\ng85jTsPyvT2HWNC094W41Jk6COAG58wNK4HFib701HQOTJpnaX6tg5xfYM4w\n8lQCTac2nfjVyeN3BQURCBFahYtIV6em+rt82FVFnaTDEzQnXjIzl7FrshUh\nZHpy+h9SfGqTaVolkMcLxl00NWQPQAshOZvbva6iXbCrV8VMlwmjArzlMRiS\ntHzetwl04d82A5U25WbV1bOiXqYBcDVqHDR3WJOvQLzsdXc+yPbQSvcDMC9P\nDDxdedAr6go1bvEqlvOn9eqLlEBrH+gR+tRHAhjaThsM4fPMrdvSxVzoW/r1\nC5ok74COcIK/yPOwi5+4IwGp81CASsUfsY/LQu3zrss2nk6kgZhPX2/Mfgi5\nvMSEn8pc8ufhy7k6pcvbw6nvYXybyhRVRz34gcpZUHxarroQ8z/3VvHF63tn\noS44y6dH7TR1b9mZJwuKrIlPEs+cNdBGTAJtVftHW2758qLY/XPSvIoR1jDH\nKRkD2QVp6ont89h7yd2+d2Cnq5aKmnIIcWKbpIkFTy/v5AQd0O7gXg0sucik\ns75h\r\n=kzCv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQChcOaOCpeqDqbQadUv1g3BfbiN3x+jF0yro4fIvIRMHQIgY7vbTBIjzA8GfXZNN83Cr/sBcPnsEFIGBSCiPxQQ2JY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.20_1571730847558_0.15614197578398237"},"_hasShrinkwrap":false},"0.5.15-alpha.21":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"c0152a2d09368debe03563226097c8c1d3d1963c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.21","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-XjdklAm5/5vGLv7l3A8pA3NpojeKpbyRT9h1ZJK+KtMr9jXF47xX9awoflF3qDxSYcYhRhLZfgPzqYUxNRXrIQ==","shasum":"6cb78ced94012ebc626682fba5dad2aa84f254cc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.21.tgz","fileCount":11,"unpackedSize":20654,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrrmqCRA9TVsSAnZWagAASa8P/1HQVBiSFRqjMQoNkBD5\n19siD8MNKsDQcRiaFyL37vG9iSDGgE3PphbpBBqIiVbrKJfpixsiDzR1QlN/\n30ZURP15hF2trmTwkkVMCG0LdLTmh1uQVIaQkMMp4gQdky38UgYvHxkejxyC\ngUS+Nl/0BucGzldSMCZhe1hynRhTgR+RuDmELksYcE5yorUCjjt9cOoE6His\n1jFydhs4r1soxJpjWhFVTVOupyh74avez7E6FBnp/qtN5rKHUWApTzyNSXQx\n7fvnWBjkSyMARIktgleuV4xBFsyNBiEn6RpwAYtz33VZVe3oC3B0x5vkFX1j\n8bWB7bYOwqwnjK9/ADfmVAYktSGvoOScB4HS7wOH04YRg5t+LSYA7psXzNHw\nSfC4fjuBCDHrUPP8PbZfTgbo4p1Y79NGFvjlfSR9H9Knzq57TrRp/bsByf80\n7nulzoJmJbhPX1SmRfgFt1/BmUQHtjP0519wXDmnUzgopnU2HaR0wkvQwaRE\ndMTAoRuJugGk5NQASQ2bvGm5qdddg4dUsJHrPOufQM9FlRo4FViU9QvJfdxS\ngm/UUIj5BalpbdMt1ChIT68/H8hM5tB4MsKjgdrrp/oAP4WSyKTHwlroNSay\n9zRN45gifed5pYQgzRUezPScUqv2hrLMZshcESQHFR4QpWsn6ZwIWDcPcRCJ\nRNLn\r\n=gugK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD2/HqfFkDXW/GEi+frinQ3AuKtVmcKhOHQWLsegw33hQIgItyCeosiLN3lRfLP7JiHIDQFCyfWqvtHhUU3P4ZwvN8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.21_1571731881854_0.2648364761404134"},"_hasShrinkwrap":false},"0.5.15-alpha.22":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"0d7d9784bb6596b0db7312d7dc53cbf092d43ad3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.22","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-VNhNJbMVewZp5UYfxXGzpmaxlB1fuhLO8O+OHZ6/CPMzeQdECd0YOFNXTAAsifysW6NsP3wJ21DVsHA1IfVrVg==","shasum":"14cf3de383d0251be80898e0ca88703667d46efd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.22.tgz","fileCount":11,"unpackedSize":20447,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrsHcCRA9TVsSAnZWagAAEuIP/3XgiABB8IJCF5bW1Fba\nyb6FmQ9ZogFpefjnAhtLkVsRVv/Vt/s/7UyZ0kNVR704zWIf9T6Qstbkn44C\nVJ9PIiCl5rv9cuzZVtym6laGrBFDlaKbazwhHB9t4RQIzSUkAH38ct2Xwuud\ntInylDFKRiXwSruBNUvuzw9xEKH5BQhK+DbbhXeKn/7apykZv5r7TJNbNNvR\nAtGST3z0r87BOJsZ8IHLivjjhpC/4Kr85TK6+ViYoqNK3DzePrM42n/hmNsB\nHvYqYbBJLlILQtz1to9fyVBbzR6gP8h8R0QSA2KXM/0gg0JyNiJ8/0p41HQj\n3Otf6Hyg/3fh+87YwfXgUdXnCOUtnhEh7RW0z2oUMegNPxE1ICFTmHpCLd4s\ncIpmap/T8CNVW8PzwixQa5je3XCsmwYQH8EcR2X0usO//NTrYRtSfVSR82/U\nXZPN03JCziIy/ig7JnzTIIr/paySxWUNeKsTq+T4o9mjUzkyyVqGcgJRtgoS\nhXSFzk6LrmDd7H7yS/PY+mTUwQI/gUiquOfInUJYmFdqKRD8dhemRWiXx3vp\ngkwF35zE2ZRMGtOBvUozI4BkmcBC505VWM7oD1M0xgqOd5j84UW/xCu00KKf\nCzGMHbNEHBOrtHfdm3ErESy4crl5IlxRMGJ9JDfX1hFYFI53Ihz+Gj9ZSc5V\nMTsZ\r\n=QRnj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHmY3CWzEUL6W2pJwZzaRoMrfRyN6WMtZKkW9O+EdDuRAiEAj42idpA20UtlUbfvrN9qfmD5AcYQCdeqzp8Wq143dJs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.22_1571733979492_0.6329233300309483"},"_hasShrinkwrap":false},"0.5.15-alpha.69":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.69","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"0758b8663b0419c63829cb577c1190761b4f8441","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.69","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-PP9dxzyRBWce99YhFOzUaueqGx7pULothiaRTgNEWldHvbZL7Q3g7eMXX5Kc5aYitX3FEJTkgqjxiAwgG37IQw==","shasum":"741f4549f9a57c389aac763660414c531a7ba83c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.69.tgz","fileCount":11,"unpackedSize":22767,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrxTDCRA9TVsSAnZWagAARawQAJv/XD/TuudtKI884yxh\nFPQOD03I6Jn5o+0gH4vkCc2cOhPeCEjcw4E887bNUGpDb84V/XOcXds+sHnv\nJLX14QeHRF1Xkk3ogCVA6gtUXPkrynIP/GWPwEcDeNHWp2GQgYeBaKaSbEBf\nmBUrTs0gLk2Yoo7yNvfstcw7kU7zTw+VRzR+4rc1kBCQ979Lf+xPNyv2K1sa\n6UyHbhU5Rro/5khls67zEUJSsuBrp+tZzCqiMYdN4jGwIGWa2iLOLSOLs6Pa\nWbcRRFikCOqOhlWSO3QJUXSY+WLQHyhTBhSr+twUJ6eQUDgOhNljqoTDdq/O\nbCs6yEHV6B787yJDEGyLEmKQvaOw3Bvjgzi5E/tISpJ4Fqlcq9JRarwAhDtz\nsfddwlB3FsQuf3nixcqvn8rRR+d5/3fHRsnHCZTTFoaKsn5ebeXDbDqwvDlw\nO/7XLc/myHnUYla0MzKyuG/OQIsD07+nLy3kSuk8zz9ZGY+trmLyA37UBUAK\nCDZ4fk7ngU6nS2J9yRlN0BpyYTyAk1y3KywBbmnVz5N9Rsnus9jZJtj2T3LM\nTyo/k5liZXPuUqNmU6PguLqfomtxTHIbyAtSICiP3CKTTAIWgSCV2Ypgoqlx\nSsVR1LHwAb0gFmgQ5WhaoJVGehX0xSveDTXIS6i9eYuucwXZEg8BPbmGTNP0\nYG4E\r\n=cEmn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDnzEi94wFO8oiTKTqeq1bQgzYczm4wsX+Y7VaT9h1KdgIhAIp20PnO+cNC/nYE5lDi+ErhzrWaZdPgl5GYKenbZJFp"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.69_1571755202778_0.14194241045145128"},"_hasShrinkwrap":false},"0.5.15-alpha.70":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.70","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"48cad3b8069d185931a2a247885defe8b2f4664f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.70","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ZsG9HlLeTFWnbT/kuEoT8jzJJM/zdI0vo+sY+n7EkfULw9fXTtOmcYRgbtztL+FAk1cHTjPfZ0UUWTFU4Sbxlg==","shasum":"0f9898c932acc65173a0b2cf359deaa5c871cf6a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.70.tgz","fileCount":11,"unpackedSize":22740,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrxZ+CRA9TVsSAnZWagAAiaMQAIzTuco1ZK5kOU8qQ1eO\nd2cPaN9Yx1GmGWqoybSuHyEEyUGN5Hdam8HNEi9DEV5f6whufuVftX7elgsi\nZ7U36X/DqrpBP5xTAn+DANDbhpO3LMYKSrFhTvX3Hgp57fO0vuMpbIXB9rL+\nuOo7iCk5xOsKsOkubAjrAft1IxnjBObovlk2QF4PmtYdz20PdqK+pbhwDlad\n3yR3GjWby/gfyf2R7UZxzoJnLYQHjRWHMJ2WurImfZDW4pvBV1tSZyVyBFxB\nujnZoojASmTfWFZyBvwQYKERGQuHI7pXyJzLl0juLJjaGH0/VKcfPY4/RWu4\n66p0YKIA5jJsODGQz5jUbcUFt2Hdodsav9dvVjzkw8yNg1XUEWoxw+PJkne+\nNrAhjapXn0QsHtubq/uS0JZ9zkpHh6sCVtXazs5NGs0wdRpwY0N6BID1SxL2\nbZpivR5QdWC4FyKRVFx43004sV4MikzqqIhQWZ6o+e1NmjOSuU5CXBO+OiyQ\nJu3DUpBznWRis66MMcPt18WB6WvAX/4cka8Rj9KEiW46wgCoq3MsELQspL+M\nj4Wcjh5zwa1oyOuNL8RleRHSg7VLD2/cbUGb8AwXgnZ4ym+RdYYU1F75pBLq\nHuFQ4NK8Izt/yz/WCTHElCIkBB1eGqFWgAi40g+ZbkxjBi5ZYHH107l4Tu6p\nmMg4\r\n=4LxW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHLR5pGoYU185FoMGaXOBiXMtXVuI6KkOyZTmhVPuDsSAiEA6tFyQk9OoRHfYd5noloUeHbxgh9jcuWZtdh53EQAMH4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.70_1571755645490_0.8127952155493785"},"_hasShrinkwrap":false},"0.5.15-alpha.103":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.103","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"91c319a0b43208051aa761d8a7f8d3acd5910465","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.103","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-8OoBOqdNjl/veCzM/pVrZWzCFZb7p9w/gkdDWmJ98r+SDR3MTd0Hpzs0SEClgCPLEkvYRQRooaUEnKIyPeL/FA==","shasum":"d28092455e3dd0f913670efc056f3264698cfa86","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.103.tgz","fileCount":11,"unpackedSize":21803,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdr0T0CRA9TVsSAnZWagAAshAP/1DFhuJjj66b/F2ZoG+c\nWs3qRrruztD9mNdh8TBxdeK59YF2N+nfnLab4BNguaao2hXo22HoJiqC4Opr\ngDq4ReWZSK0o7hILukCx0qbzWyN2LajVH0p/NUNaKPqxsPT3cED5+Ukgiqvy\njfUz4YOXJuRdAmHSML+ZJA/Nqo3BWkk5rnk4MMfzzxryevquoVnatTTLltou\n0ET3v/okWNo//GE0MB88jmtRIu/kYhmg7p+8W1FrgeovFJ5Y5TyPac7VPWu8\nzrOdk+SOdGqY8e8HO1GKCe6raZoqAiCFzy2jZ8uv3IpCPWhfz6mrmC24OfER\n3ncb+L20Dt74NH3IQWptkfXw6ZmDXArhvjpwsJom27HZdUK6HHXlZyeZYyjy\nqho6vwUTdP4hiWlbdqs3QTtFyxjIZtFpnvMqWK02OWs036sjMlSIgDvUF1f/\nB04PtWgBT/7Aj/HH/8e3EE4TS72ChRdjG/HUMxKXJVSE0V2oRspvtJ5Rm/8M\n4Ta6zdeeNGrVySKlF44gTGFEdlkcYmTEHupg5WjQ4W+8TbvFo5iBfaybCWBm\nNTy89mtDPB9MYLb/Y04upNXmt7xeNFgNtAy40rmkiesdLdUDkx+YpeZG80km\nHfocpAb+sxoBfW2kKpcURt3KdK2lX8LbJFF/HXuRgxG3PU5Fl7NJPGvy+vBc\nJt/u\r\n=HHdm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCbr22/FWUyvLJhfdQVJ9+VJ6lytYUa0AZs/8YpXrRaNAIgVVwRFAtvxgS3bMxcaJKQyTMEzET6fJi4HgwiGuG5Zys="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.103_1571767540292_0.7910239628260975"},"_hasShrinkwrap":false},"0.5.15-alpha.178":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.178","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"0efd2621da5e7d69f9d78eec92174aeb6e7741d9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.178","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4rOLgYGdLZ9zwpuyZQpZAymuqRpFUWLmEW/Vl8HWqHt7AL8fG2HFWmwUA5kSuMS6lsxBdOv33IUWWol/+ev5sw==","shasum":"bbbe2196252317f86db2bfd65445479d89d0da3a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.178.tgz","fileCount":11,"unpackedSize":21841,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsNrACRA9TVsSAnZWagAAMmsP/3O2cWjgtytzbCBVPuWu\nfajHBAJohHoaw9QxdVQN1vIOWPDV/lAFHbq5c3sJX+gxAj99ygjj2S65OoQN\np4cWf6LWAQbMfVrHIHXDX2b9gZbmOlVJrbaAXLRpvuCF0k5tlYihFI/EceVq\nqyf+PoklzGbFvuLFMq3cADd0bqVZGjZQ3X66k5IwuhP8OOuNmhu8UV9O8rKk\nHtr7rKjzRcLFpAU9GUL9qdwY4dUgojZuZvXihIj4mqEntRY5h9H4tbuTiZuy\nvLlweA7Xb36JNhJtu+E3Fl8TjSwfbxhr4VM2ZdVhom1UAHaifrD75staIV3l\npiJz21hlAttAsuTh3nHaboIPLDfpwv5hnCRykbPsDULmXIJmpBg7XzAiXf0X\nIOSYp2MfesGSJqc7ec1CCfq/8jOMZ56y9cm5q4xySdWZvhPOoo8e5QI0bhds\nZTn1Y+Ann7jSp7tH2XzrFZUUbAR04xcbp2XPw8n3MSBVfb2bG1JK1adbIKVp\n8reP3sV9snNaS1FN9whsaA0DHe40PW36yWMa1q+c7XlcdmrfShmgyojEEVpW\nZifIHj+jpmj8/qwTA6yjqNGBOhf9FlVOirM2+VCDSPSOGQ6VJIovhSkrWLCb\ncHw07fWNSJtQTBEpPnvTp1ztjg0pcW2+vZ6GkIJ7OsgOZAOMnaYjZeLZEzyG\n50wl\r\n=PpOo\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDcT2/9QOyW6L6mmWQ2/9dLmk0g6UJauaLFwsDGzhOWwgIhAITpd3gGlEPtHcAeeTwjrDQ8r35sRVUiTk66RoN1ziQ6"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.178_1571871424140_0.3773733062629039"},"_hasShrinkwrap":false},"0.5.15-alpha.179":{"name":"@react-ssr/nestjs-express","version":"0.5.15-alpha.179","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"5fedcc77dc10ca1e133638390a903d11946b8ac9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/express react react-dom\n```\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.5.15-alpha.179","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-wBeaQg7C63r9EAmt4erf4mJ7ISmw/3XHcYs0MllgXOPcSnnR6R6q6Kpftm7sn7lDGtbjl52KZcsBQaETqOCW2w==","shasum":"05f8c4378c83f891e227817664d85923f44d5168","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15-alpha.179.tgz","fileCount":11,"unpackedSize":21841,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsNxcCRA9TVsSAnZWagAASroP/At0wCAN2Bt3M3bmcKtf\nIw6Ld4tX0Ijq5SZyO9wLjF1f565V9Ja6ltGK9jM5CGcKaGa79SH0gZblKkzu\nP0bRVcC+gT68XEvLEhLkYzZlkOVjyB6+OVPnnrVjMVFRcII/MEUWj6GWPMM/\nL+/2yAYEaEgpj+EFrLWac/PmS79lFZXr/GvNWvVjjEWBurAXdsMXSfYvHncW\nwdAtceRQMeAUqqzvQJix8E14IvgkcQt0FMowbZfRNlXXvVDDW6BE81nRxN2d\nmmu+Icl/aoUelj7XVoGISVli8YG9HqRze+hLFv8WetZttj9lrzcO2PB/2tfU\nohpTOs7rFA9hDe7xmEQy8Cm2TyifaVNzFUzaLubTYn4LQbFnnn1Uz/cJk6o8\n2RU4O5luBYRTc6AQsEkINRevcd0qgj7fH1Y5OapsjuBIa5054s5nVChMID0K\nKnNJTf0D3OkHH1tgDO4BhwwmvxJ0glpXaAUe08DQhpMHIT6wdlojcaKiOELS\nD7znALjdjp+9pTg+oNTn2NL0SrenR5m4yZrmoJ/qyJ63rhUf03eLQY05MTQy\n5qC742WZ0U2G+Eaa3VmEYi8CNPZoswrTdaPYSzfdMOMoM2c8R5MRYooh2eLt\npPNf7FQAZpRVGqy0dpBQeuGAx9Y6r60j4gGrzmqNiZR1mMikCnDz8Zm6SlDP\nS/IP\r\n=vTG5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDD6Nqqda3/DfYLnB0+QpkZwbVqIl6tjNYw63eM7KfGpAIgPirruGNCNaCZKGupPRWG8xffDmh/C6FW05XD/e14cYo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15-alpha.179_1571871836300_0.23582295070533643"},"_hasShrinkwrap":false},"0.5.15":{"name":"@react-ssr/nestjs-express","version":"0.5.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.6.2","@babel/polyfill":"^7.6.0","@babel/preset-env":"^7.6.3","@babel/preset-react":"^7.6.3","@babel/preset-typescript":"^7.6.0","@babel/register":"^7.6.2","@babel/runtime-corejs2":"^7.6.3","babel-loader":"^8.0.6","babel-plugin-css-modules-transform":"^1.6.2","babel-plugin-react-require":"^3.1.1","cheerio":"^1.0.0-rc.3","chokidar":"^3.2.2","cross-spawn":"^7.0.1","fkill-cli":"^5.2.0","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","react-html-parser":"^2.0.2","recursive-readdir":"^2.2.2","reload":"^3.0.2","resolve-as-bin":"^2.1.0","terser-webpack-plugin":"^2.1.3","unionfs":"^4.2.0","webpack":"^4.41.2","webpack-merge":"^4.2.2"},"devDependencies":{"@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/cheerio":"^0.22.13","@types/fs-extra":"^8.0.0","@types/memory-fs":"^0.3.2","@types/node":"^12.7.12","@types/react":"^16.9.5","@types/react-dom":"^16.9.1","@types/react-html-parser":"^2.0.1","@types/recursive-readdir":"^2.2.0","@types/terser-webpack-plugin":"^1.2.1","@types/webpack":"^4.39.3","@types/webpack-merge":"^4.1.5","cross-env":"^6.0.3","react":"^16.10.2","react-dom":"^16.10.2","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.0","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6","react":"^16","react-dom":"^16"},"gitHead":"ac05109408925e4a298250b67211a443f729b25c","_id":"@react-ssr/nestjs-express@0.5.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-V7+E6juZ4BtL4fuDqsIdpeBQgM5i8FgH5ImdIkVyD8uUwcD0BUpC54Ir7sXuaP+o2NBkVoEJwALabrupl8pK4A==","shasum":"8a9d87845e699d311385dfc17f653e5010503bb0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.5.15.tgz","fileCount":11,"unpackedSize":21823,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsNzWCRA9TVsSAnZWagAAitAQAJxHcQ3MY37LhLRbzxtY\nRHXswP2FZV727TuADpspRNM6jM2KtrtTa6gQaVTOXyTWlz8dZ/Qtqhj7qrx6\n/PV6vjV/k5WWhcm1Y9YB5xMUqVupNsjk8cOW6qWTEcLsu/9F3zDJ42iQYLW8\n1rggrdinW9+VRoi/aTHy0BuNGDFrIoVekWwHhsqiJTYMoiwdhI37HV9vVRHO\n11RiKczd3udxMF6UD1A0Jj/KRyTHXmnUYH/g05MVXmZRSnPTslMVSOLCzB/y\nxXy3rOEe2I5yZRj6jOsYQvYTD7FdXIdDYIsfDmvvrhVfzLJhcU2eXwpT8kh1\nHxywkBRnu2oSTr4gVFwI33WgHYAWJ6lTEBA+gSTMnMQRF9OdXE6CanJR4MwJ\ndbsiWUk4EamBG4EZPkEbywXgWkyHNjn3uGTLUnujSa/2s5VXSP8CCsA52Sk9\nJfVWZ6Xp0coxRrrzOGe2yuf615HPaBOIGm6IkPazZd7Lpo6xN2PMveIYrj/5\nUWoO0mxD0L003tmahxL/YE5MrcgVTNBPiYxir7Psu4H1zu3veM/vv3PWHsbD\nlOkSTdrZxOw+NkI2K9aj2PxG23kKkZEcB7yLIwrcwH0cus3M1Cm6JHwBWYGE\n0unXPPe1BMYpzXD7BDHCUGjtluhubQAqf4Kc958BddZO8VO8fvmb/zHC7oKN\nRfql\r\n=tY8V\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC3coTJQP/yDKG74mPyOqIiEy/To0fvrAZSF6B5wMfMgQIgXzHVO2/1O0jZ3Ignpg+DKfEsGgeuQx5Ghu/dR/QnE5k="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.5.15_1571871958320_0.6784316385972033"},"_hasShrinkwrap":false},"0.6.0":{"name":"@react-ssr/nestjs-express","version":"0.6.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.0","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9147bdec06aa388f2fc37026db7b562275132ff2","_id":"@react-ssr/nestjs-express@0.6.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GTRnje/m40kPUqBgrTvKD+QJPiopDxEJP5dDRpVJQotlBrTXoMwmHuIh4gwwjF4EogdP9pffWjPvyBN/yCshYQ==","shasum":"286cbdef7b3087b5256d3aec5619b52b413aede3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.0.tgz","fileCount":7,"unpackedSize":18566,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsUT8CRA9TVsSAnZWagAAwv8P/2YWviaz52SaIQHyg/vg\ni3TCVnD4PnzoaRrFgysbe2nMCWnaRR2HQsSKLTRbru8lzHCQ75hFxxYLTyg3\nh65ToNytqphTDha6ezKnol0oGGKUxgajppvS74aUxak4UYPuUFXVQOXGlFdH\nG4QB2UkNZActJp8ztEKGAH22oszCd6HsRKzCUGFwcwC4wfXfeSCRNk0UozOT\nEQwg2OQrXuSkOymd1nV+yflRPzmGu+dhvekcxteY3SB/N7jmgVZVFLwcgH1Z\njRELyFIUyrDyoIP0UeXyx/J9BzP5emVwKEb15XXoY1sR6Snmx2zAMGMHBICf\nw6JpxqiHTwrCInV74kJGWZtQJUxXaxvjP0s+FgIU6Xxyg5JElVnqF3/Vah6x\nfXz15I+QU5ykPEfvIT+OtaFIUj27ehONU6TfFdq5YRzxqpKjfWYNMpAUIDRM\nrdZU+i57jvH1bt+WO3oEDBijtjDjb+2mz2jJKZeli5kag6i2KGn0u0p6HHbY\nQsnlr9CrEAPPvcrcZ7plyX69AnkC+iEvVoNJd0dmbyo6i+vzX8y8GN7fPJWH\norX3M0UxBQ4BwsPbbTgx4vheHWic7Z7LkEVUU276eZxDLN9mTQ0ZYDd/2c62\nniil0b8mZt+LSl5ZVRPXhibCQrWljrfuPXxW1E1uAoTGqaYrA3bnfKeMpQCa\nLfKu\r\n=72sx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCDL4HZpTrYQpTXSanOuu49dtyGB224yK0Uq5Hpi5m0hAIhAOzGsV8hYHk/+f1BC346QthXakNBScXv9hPUZz9DlRoJ"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.0_1571898619642_0.5112781486238516"},"_hasShrinkwrap":false},"0.6.1":{"name":"@react-ssr/nestjs-express","version":"0.6.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.1","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c9da0ec0d9e3e63e41d1d5edcf7b39fb8d9ce1bb","_id":"@react-ssr/nestjs-express@0.6.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-WKpvA9RHpjtUaGgQbWQyXhktQOWs3I5Uu781D9Tf+CWBh98bR5Pi1Rq+0FdJAxxoc0JHPyonRYY9RFCOPDOYUA==","shasum":"db2c15b623db95a71ce1760f8488ab2472dba163","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.1.tgz","fileCount":7,"unpackedSize":18566,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsUdICRA9TVsSAnZWagAAmNsP/0eb6af6qR+TgNWR7e2Y\ny3HPqiJwlW59rJ3bLbDJPCC/VVm/WAUfzofc2arBsCi7lcghlRR2b4fKFkSu\ngjC93r7IpWra+F682vpbnsoyqvJHFBsI9BS+rzk28WjflhRsTXQPfsNoWiIV\nBHRLKJ4LOBhzUSmdUhg9fqoy6XaYHpawfMDoKaXqPb9aNg5nM2BEtH67jt4A\nEGnlxOUjvmiZzv9a1q7d/fQdEieebZ68BusvG2oZfycEM7s4DcpJEI2pyYND\ny8jkpVpxlsxauCy5cG2SSiQuYZxnZOBPTIh1Qp1FRftGAhwvZbQ+8PWkWaId\nVyJ9D6jrQYcZp3UEUfVb9u9RsltKYhz+6/ruClVzK323sGp0c3cc3/G4ovij\nXW7etnI2fo5AEuadbTQPQJin0xDKm6UYF+/COPjSb9Ix8r9jrliwrfZhNpY4\nHGWk8cNmPjLMOU2SLeIHVRC8tspDO86sp16faEdoto9Q7jyMvCZ1TQ/hhg9w\nhc2+K10Mb7DKrDuh410i0meM2BWg0JUQhWk2Fwsm5UclTsRVmdeGHMNOeVI9\n/f/GyVYBFFobufv1kGwdU274xXXCeUb4zXWr3/2axBxodtWiL3f6A4wGr+6V\nfyNJP41Eph4Jds50A3KpbOoItCve5UXNeC65Q+erk2hdaMLpbVIloCxiBbrP\nXjVO\r\n=29Nh\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDcFF+BhypKoh9LzUfL6ziauVf7yshFsnPUH9vchCFnsQIhAItrj67rEV3iRYUjjwgNLdV/6DXHTyZlkdFaCE4b3qq+"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.1_1571899207846_0.7856000525706162"},"_hasShrinkwrap":false},"0.6.2-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.6.2-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.2-alpha.6+bdbad0b","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"bdbad0bac0b50fda15c656c3fb585b33defc67a8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\nimport React from 'react';\n\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration\n\n### Registrar Configuration\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // default configuration\n  await register(app, {\n    viewsDir: 'views',\n    distDir: '.ssr',\n  });\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n### `ssr.config.js`\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    // we can override the default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.jsx**\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.jsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.jsx**\n\n```jsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\nEach example uses `@react-ssr/{express|nestjs-express}@canary` by default, so it may have some bugs.\n\nTo use the stable version, please rewrite to `@react-ssr/{express|nestjs-express}@latest`:\n\n```json\n{\n  \"dependencies\": {\n    \"@react-ssr/nestjs-express\": \"latest\"\n  }\n}\n```\n\n## Starters\n\n- [react-ssr-starter](https://github.com/saltyshiomix/react-ssr-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.6.2-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1ywIm0ZpoYl8NE/oGj3e+rx9GXi4gfgoqlrjiekfyLk/FP85zFCsQMYyC6kRTvXWYTzyKkOW3swwj/Y9FBWRyw==","shasum":"6413a0acca4a99357257e8716b980b1d843cd2a3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.2-alpha.6.tgz","fileCount":7,"unpackedSize":18595,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsaweCRA9TVsSAnZWagAAKxIQAIK1vLSMZvdI7tWjJJoQ\nHciYW+oWe2aGMoZln/8e0SV31u2Rzc2Ox3LuaIPz6GTQ+jL5lGiJikeLt5jv\nCnK0LCthrSODfEZAuK1mI2FVbVtbiYLnniEPD+7rJ8SiNDN5wKLWfBW/pr23\nDvHdSTkA3k2Wolp47X2WZv/9FfFQGrmiMujzqSh65SKbufihF2Ku/4bkqNTr\ny7xY9IP5WBOgBSdpI2jAjAfj/AGTcmD/G8CaFClW5OU395wiv945MqJWFHLU\nUSUUWBcquh/QnWT+jEY32M57Doh9EjwmpA+hjNkMU2GnyTJWnNkew+x3CWLN\npkrh89iwECaI/5MIaZLyEvTLMluu2xGlH4FhqyZ1x4x0v6Fn9C8R5/L6i0gA\ncFjMui2EdDFCQsqS8TrkAiHHyzqzc7a6aan/flGYNRkUECULltYMUAoS+7/m\nwQ67P4nS8wKr8rCj/GpiiB1DcAHr4TBKEiMeWY+OdDr8mIdTmyzeojZ3mGxJ\n9NndkeBWpa4EDSEB+SyTYaPZ6VEHWMA3gN3PwZMkkfP57IR2AwKLa/1YBqVB\nWcFbN2odS3CpOV0T+2Fka/Q4qU78nNN8tuZWQm7Jes/wTDSrS45PiDt/QZBx\nn9zPGTyciAl07ZtZQrOhcOJxTAzJBd9T9XbLZO4EA8U5khCADfFVpi8Qk9m4\nvVlS\r\n=Abtj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDz1zXXmd5aHPpqNuwaPGdeKzFMOS7x8JJpKO6q6TqDkAIhAJg+PJEoV2LXkOQse4L8hwH9NrZgf9cJb4I8Yijw/CYm"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.2-alpha.6_1571925021806_0.7870163566180717"},"_hasShrinkwrap":false},"0.6.2":{"name":"@react-ssr/nestjs-express","version":"0.6.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.2","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"655bfe55a76a51545fd3217f5e061d44828df12c","_id":"@react-ssr/nestjs-express@0.6.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-EPW5OIC6/5W9bYOehcj3Z4jyNWz19GXldETLzJlqzLZnz3JUv6c1iFXq76J27KsXL1XeLxj/WqrMwsUgoZ32WA==","shasum":"5ba8c6333df5f83c3f9904880986fc6064aee214","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.2.tgz","fileCount":7,"unpackedSize":18657,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsbGxCRA9TVsSAnZWagAAMskP/3PBr7BtSzQd0MkiwdyY\nZh8cC1ULkhV3jOa9qIdPBb9M4rVrB0Re/vbd3tiEGEXg1GyIpvkS49pM/+4m\nXQcvDM83oqRzoYHQQoGI+7ECu3F4qk+HGQr0aBmAe1ehp9Hfjn59WvkpSlZd\ntkvydWpHZNd9DmlE0gaU3Unq5i4gDdoA3B9bVSEBk+VwabbXmHr+2k1UfApM\n8YlhWjn+w3saGdFEy7cCt/T5pmlQCQd6VTGyGEU2wrrsk/+feVyyOhfJAoGU\nPzrIxU7IIwc2gZbjiI4Q4DCo+10bW3fp7c8aP0avpm8Z7jquZMyUOokYc27l\nVlr8FLApaJspGYyx6V8+puswlaHdB6Mp0UXqbwH+HrxET+QVGtmH/XR8jap6\n+r4mOT4rBlnCZcMwb5o9M7E3KDBB1tSjtkgUGednAhIeSk0RAdMJGYgWGlOE\nZ2WlDFl3z81n9IDSyl0emOAWREYqQkxt5wbNUaxn20b3iUt3xQT/sMtP0/7D\nQmgpUBmZYFRz44oEk9rGo2kCAZ1UkQeKYLbIBUEw9B2v90dJqzzfZCQBPC0j\ngDg+ZufbB1abMvibAo4JFTELZ9mqb+pqoqQHiSNHm59D7E1YvKc+3t+S6SPz\n5YIrMpG56jDkgpjddKF1rt5ixaBGwBlzqMJysVlGG+wO1R9H9RZ+gapU+73F\nqP9G\r\n=zA6l\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDutD3pRwaC0jBGMH6VocjfretrE+U+0MCTP2yJhpwbzwIgKVhoJYX8aiVC8Ngzn8WC3w/0FYaWIXM9THLV+UiV+xk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.2_1571926449441_0.2415954210332456"},"_hasShrinkwrap":false},"0.6.3-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.6.3-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.3-alpha.0+b4ab713","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b4ab71364f2afdd83bb140b5703d84976457f8e9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\nimport React from 'react';\n\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration\n\n### Registrar Configuration\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // default configuration\n  await register(app, {\n    viewsDir: 'views',\n    distDir: '.ssr',\n  });\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n### `ssr.config.js`\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    // we can override the default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.jsx**\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.jsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.jsx**\n\n```jsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\nEach example uses `@react-ssr/{express|nestjs-express}@canary` by default, so it may have some bugs.\n\nTo use the stable version, please rewrite to `@react-ssr/{express|nestjs-express}@latest`:\n\n```json\n{\n  \"dependencies\": {\n    \"@react-ssr/nestjs-express\": \"latest\"\n  }\n}\n```\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.6.3-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/tmETmj7NBiH7NO3NEeayWHcYvY+vJyuYPKWjm572FxGTcjW/9D/RbIIWriURFNsmoalX9qKXRbSJbPbcAzAMg==","shasum":"ebe7f44dd11f6180b720301c15a13ab956f77a0b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.3-alpha.0.tgz","fileCount":7,"unpackedSize":18650,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsbdjCRA9TVsSAnZWagAAHccP/RlI5a7C5MhZQoKyFqNi\n2Dy6TJgvlTWCTMZnNg+pppQgoXXXZT2wn9P7MbeaP0YEyy15bmXx9eKB2423\nwc5+RwXiO4PMvrP7TrX+xJIgqdqNsI2LPfTZm182GW7ucp2pekD7TulBfWKP\nsksKPWSBvIGwko42oo3+7GaUXfuayye9QvjXBCSpU2i/8W3mrCRiHnmrP1V6\nvMKTXP37qBC3aQsS49jsOyLvNQaMHLvuIs6zhRbUriemB/f52eCI2k6oZXxK\nkrARc26jTbXyZu+LbPApdz06QF3cLtlSkWutZ678esfJfXob5NZG//InQO34\nIarCWz2PBJ/nxfJsPXhE8oVaOH2jvdKtNTxfz3VKQQlONIWa+x3HMKJgpBqh\nm4HGudQ2huZ2Rn/UJIRe136oiFJPL9xI4MyhZziBlMztvxNT6fUnBOzzTaei\n3Tv7oC7T5S8iaTole8DizSM0ADRn3qP9HMqjogONtC5ysDkqmqUzBFnyyFMl\nbLBr7O9zrz8gw1/tQoot2l4pu62oDwVHB3xb65bJejK/2T0VP7LlS/LLr3Ly\nqne2znSYc/SawYz4YVEpoZ8Hm7/RJyxy3yJZ8NlathNIU+GRoSxfVc1v9Pgn\ndN9YooTgt7Rn1O9TXd14n+UWj1lNZ+K+qe+AHBangJI6N3NQFZ5OR3a1GOvS\nkVMp\r\n=pXCN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGKYSW1okDi3dWAdRgEObpUr3t9AHIVvw8eAWa8mQdNcAiB/80nAK5q9pIkegICYfPtZ9NoopqOcfu+6wFy90TpeLA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.3-alpha.0_1571927906848_0.7099670764881425"},"_hasShrinkwrap":false},"0.6.3-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.6.3-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.2","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3c8c377f693dc4fc375e4937da83e6828f5d3048","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\nimport React from 'react';\n\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration\n\n### Registrar Configuration\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // default configuration\n  await register(app, {\n    viewsDir: 'views',\n    distDir: '.ssr',\n  });\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n### `ssr.config.js`\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    // we can override the default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.jsx**\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.jsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.jsx**\n\n```jsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\nEach example uses `@react-ssr/{express|nestjs-express}@canary` by default, so it may have some bugs.\n\nTo use the stable version, please rewrite to `@react-ssr/{express|nestjs-express}@latest`:\n\n```json\n{\n  \"dependencies\": {\n    \"@react-ssr/nestjs-express\": \"latest\"\n  }\n}\n```\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.6.3-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-LyrNHOg74xffECtTY7UsE/W4DXdm8cbSKe4kMM5cBKvqfwvsJdSrX2uVbKRnxgBVJP3fawSMDSmteKoQd/R5JA==","shasum":"a9c5aa2dab97b5ceb003521abd610cb3aaaa916e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.3-alpha.1.tgz","fileCount":9,"unpackedSize":18845,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsbkpCRA9TVsSAnZWagAADGYP/2wL0yWbEPscWUwKR22g\nSaGBW+HBHRkzeAb8uCZWlGclTHwxxTNz7vLomCdKInOpEj1SsiZcMJ+rOo4P\nY6f1Qcpe7gyiAmcGbyVSsKb8unpzMKJowv3A74MyHmqJkGoo2d0Gi2k3BJFk\nASyPAdC78/pgEKHU6pKSpIUuHwEZDFMFvmfOkKQwvz+k6Anu5SgUuFrCDw/R\npQO2B/rqIw+MNzxgaAY5fcWr9QEApzNHuW776/5FE4uTaw2QTtQg6z64yA87\nSttLr1Ng/xE8WPz7WoBDBFBN0rnMf93QoP0Z1jsgI0qxTdPihbjcUUeMxn/y\nm/wNEMnMF8EbHbti+dsdobxhlBPA+o4qsrD33BSdyRa+0lBkE3aMuvVvQ4CC\nTtCgiqhbSmH5jCe8xwHr/1B0VpTUVoE1Z+L4jbL49lEdC+0E6qt0nGtlkpYY\nHKbZv4LEjjQK0UJPCWRpV6OAjpURYYQD4Opl2/jgLb2iJ4KE7ZFw4nqtAfdk\nEaxWybcS9uiJZX8xrYQ8lue9FuOB4Gmhh5IqDd4eA9ACgtxt36i4tZ8kLvz6\nv5qKAcrXA9SOfEMHKQi8+crC5E/wBPoc/HDYxrBDKql8XvzYMOQa6H6n0M4e\n9L62HXEr7TnMEDDeDObp3c20/Jtll/fs6QXf4vpXHALTNpT/0kfmWN/PfueH\nqmem\r\n=pORc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDjmOZvtNg1aUlQYQZPMMD+3wdaeavOUnmUo+hIB0CzbwIhAMFGXSUfMJnbRxd0oNmU0b+IPwNf4poIc2sRkQO3OxHQ"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.3-alpha.1_1571928360845_0.6516617009189456"},"_hasShrinkwrap":false},"0.6.3-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.6.3-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.2","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2d336261cbcdba49a8464f80fc2d08bfac851196","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\nimport React from 'react';\n\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration\n\n### Registrar Configuration\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // default configuration\n  await register(app, {\n    viewsDir: 'views',\n    distDir: '.ssr',\n  });\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n### `ssr.config.js`\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    // we can override the default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.jsx**\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.jsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.jsx**\n\n```jsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\nEach example uses `@react-ssr/{express|nestjs-express}@canary` by default, so it may have some bugs.\n\nTo use the stable version, please rewrite to `@react-ssr/{express|nestjs-express}@latest`:\n\n```json\n{\n  \"dependencies\": {\n    \"@react-ssr/nestjs-express\": \"latest\"\n  }\n}\n```\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.6.3-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-KlqdwSEXuXC+xKgafqOPzgp3tb4CkvKw2eLCKEjFhozSlStbi0PKrRnO6q8sdAGIDOuqTTyfxa2fdX7H7sIkpw==","shasum":"aa98e2bc9a42a00ab9417fbaf601e10b7948e172","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.3-alpha.2.tgz","fileCount":9,"unpackedSize":18852,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsbmUCRA9TVsSAnZWagAAvOsP/A8iiEBZNwdm548RckOs\nV0Y0Q4IPTOKgBy8VWq2gLaM1vpaAdnPBG4w+rrU0t/KlVEY1SyIBL4+00jBo\ncEuDpwHTg3ka2CScnetZKi03ACFZng49bQ/uQ3m5FQJu7vpGrez/JrbOFBMa\nigB4zBjjvo8j2KZCGFSV7oLlS4WwujSqQQbF7PF5PQXOkWgY0uPa4U7wi+Ae\nbMed+8bDRapIcFpXybuNFhC4CM7M69RhAyO1+iD4P5W3dBtk4kV3L5bveGCW\nKroQjRO5GUNhJ+f9CmjgbB7ucONj8th3kn2QKv5O/ZHor4wDf76fWdkbOYZ/\ndq/MlKGr/bCyhiD5cUaxt2SINhF5poJknyuAMfPWtlmBZ/XREH/5qEqhnIJY\ng7nX+mqT2/uN092kX7yCdC5/afMWNyCGrds3vFYuFdCFG6t7pG834zaIQjyo\nOBo/3QeF3KdKORxp9HGiEeAoSUeFPS+qZ03b2X2G/GW3t6edvDjDU55qXUN+\nAD6wUHcr/3vrYVDkYQiA+zSKVrrNO6y7U8JEvdUwTnEC8xIh9n5msGdtIBa3\nCiqKDQML+JasW4t+9uy6MXsuL19W3F/mvW4m/nL/NKa+bQx/VS82yf+oFZ67\nWFzcInuUm9T/QKD0K79pV1k7JkIFlfqXkNNQ/E4qGABV0J4ZVXqSafvioPE4\nly7h\r\n=QSvp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDVrn4BjbAIO2cvSX4CfcYkHAO8Z6RCO7vfa1hZ7FP/IgIgKf+IVUQ1JjLMXgvhzHSyT8u2UnYE6hBsO5NxtA7XtGI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.3-alpha.2_1571928467804_0.5327926911089436"},"_hasShrinkwrap":false},"0.6.3-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.6.3-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.2","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"abace98df78a2ac0cf69e840018ddc3985b1847d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\nimport React from 'react';\n\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration\n\n### Registrar Configuration\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // default configuration\n  await register(app, {\n    viewsDir: 'views',\n    distDir: '.ssr',\n  });\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n### `ssr.config.js`\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    // we can override the default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.jsx**\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.jsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.jsx**\n\n```jsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\nEach example uses `@react-ssr/{express|nestjs-express}@canary` by default, so it may have some bugs.\n\nTo use the stable version, please rewrite to `@react-ssr/{express|nestjs-express}@latest`:\n\n```json\n{\n  \"dependencies\": {\n    \"@react-ssr/nestjs-express\": \"latest\"\n  }\n}\n```\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.6.3-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Teh0R66MA08F1YY5Kywef1wD/hcH2YgcqIczhO8ra4ilas9H6TNKVtX3w1S5/hn5zJLm1zb2GSvVSsquq8p7YQ==","shasum":"5fc23b47ecc6e071ef7fa2ed0ffd7ca97bf919b5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.3-alpha.3.tgz","fileCount":9,"unpackedSize":18878,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsbqbCRA9TVsSAnZWagAARSIP/1BdSfyifZViyqV+OcGA\nBxOQboer+poAaxth24+5CjpaVn3/W8HkSIqRIcsViCY7jZym/Hbz7UtQu8tA\nBJHPPVWKf/3GJzrF52L+J4WA6JST2gA4O2cCa9bWF0nfE+rccHEAGT+N26hH\nDnDf/wYMzxNqx+qStzrqhxsdGZj/qP2fkRZ62W22LPqVx0GD+bOE1v86F/vv\nnoE1Bw1b/FQNRrOL2n7G2yqbEMTE6hsqmJB5SoUVCdUctR4kgtUuG77Ay8sX\nQmyYUS2pbw/0NqugwpaYgRqYNLffAVIJyNsAAc1xM5s7q6K/mmGwu8mZY6/e\n8Ee4ocGdVR3D8uH89/TKgWjR/EdL+X6vhNqNx0TzHz5LiG+nu+cqVlLtTIcy\n66Zf6scigk4/+4ev1NU3xn85kdQODUu2fn7P42Loiv7C26aQhFEBkaJW/CGt\n5aor5nE8vN+jxDrj0dRnYGlzMcr9GGeuoXQe2LJsr/hyBRDi9ZN6QD2+5Ule\nS0nPFNPWsNcJMsUDE96aM+sL10IJJaQGFyhM42XbIlnTPG49VXNQaFMiCJmc\nS94n8V4c64OVtQ4oeF2PFw1JIm9UHjM6qecK+spWBLkuAV+DvSZlk2aXd3V6\n6je72ZcB8SSp7x4Gtunf0VUWV3Sm5IpS4bFp5PdFQMTlmnR3vW0moXX5Vm52\nC8d7\r\n=7bG/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDx72+eSiiqGaYZnU+DLRwFzfuUGya8CNOhKwPc/JNEcAIhAI6kGUavtP6f3g64SAaWW4SaOQUhna9/wkfQEpYrlMbO"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.3-alpha.3_1571928731193_0.641900626272152"},"_hasShrinkwrap":false},"0.6.3-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.6.3-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.2","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"fa2cb0eb58c4dc70e1a29ab84ea8a8ec1701860d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\nimport React from 'react';\n\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration\n\n### Registrar Configuration\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // default configuration\n  await register(app, {\n    viewsDir: 'views',\n    distDir: '.ssr',\n  });\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n### `ssr.config.js`\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    // we can override the default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.jsx**\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.jsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.jsx**\n\n```jsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\nEach example uses `@react-ssr/{express|nestjs-express}@canary` by default, so it may have some bugs.\n\nTo use the stable version, please rewrite to `@react-ssr/{express|nestjs-express}@latest`:\n\n```json\n{\n  \"dependencies\": {\n    \"@react-ssr/nestjs-express\": \"latest\"\n  }\n}\n```\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.6.3-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-xcU83fGzCM5UjBBz9Jw8uEwThEPCeUjrtgA2guV2bc3MmdNIGdk8epMFAUBPPC1MRkk6GQXIs9yk/kGCxxCdcQ==","shasum":"5c0cfdc3631d9fe663c70c9189d9de453b5f9183","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.3-alpha.4.tgz","fileCount":9,"unpackedSize":18848,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsbutCRA9TVsSAnZWagAAbJQQAIFaxBDVBjB25mtnhL1e\nJ2n0qTHCdNoxHJgsoxdo9MN4rDadvws6RwVLS+Cs/SAJwhHnK6YAC0m3VphS\n0/oNqoQJ+vVxOnBaiAcsdS9NRwICGzYhqJWNzRkwoAC5qM3ph8AwewqBEkrv\nNAH6+Qo5y17mesRU0/6ShZWtd0ZI2aHkPGeMsLwXWE+q6I61eDqQwdBfJyAk\n3KLYNX/VoJ+AfDN1xtVO1uuG36F8rzoQORQHVILJhMlcHgagEZzf4A/suu9Q\n3t6mFYJsOLcF/Pcim8JQAn9J/JcR7t4ymNsr2+hDw2BXjj/GiRGv1orqESC9\n6CbtVDNZPVidtqD9seEvaDDb8cGulqtGv3EFvF1PG+L7dhrrKEhc7Iae4bqH\nO4lBauGZFvpEO5qTkjU7sU3A8/H985N+8GqDK5Z8fSeO9HKSqHh/jshwWlLR\nHUHH4fGQqH5LVbzfdwyc6BQlkFgKb6TtcPpz6Ze5Tp1m8CQMBWUq4ehYgiE0\nDAxYq4gDr6RriVpn2sFtcu5UTmZP6GvJK2Sd3DQpd1gwBwhN5q3D8PTt+FHR\nCc99tdidBvXbJJclDUUxp58naQk9N1gHNl6LcyQ6I8Gtm7zRkv/vRehMFcL0\ncbeGKKc8/PAXLo4qKhMqH7E4bE1VJihwhrPlQhNqhpEoJtTHfhcV+JqBuiMa\nliZU\r\n=iAva\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEaRk9bwbURoORfCwsFKYhhI0GIMhdGBymtimBsEO6oSAiBlFKLL27zLuweCPdOHV/dDNqlfd2q+sAaRFXK3qqujqA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.3-alpha.4_1571929005228_0.6716937273247996"},"_hasShrinkwrap":false},"0.6.3":{"name":"@react-ssr/nestjs-express","version":"0.6.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.3","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"39203bc813afde6c2eea4a747fe68f4f4f573898","_id":"@react-ssr/nestjs-express@0.6.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-EFo7VWjL/2jrUrzV6ZoD8KwlH13uJkMxWQ7yspiMg/M9IqmRytQGckw/OTgzaqAO7THB4i3jvUP1Wha0rrwbvQ==","shasum":"dcefb0a9d10bd3cc48fa1db3c1bf5b09d20d1d74","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.3.tgz","fileCount":9,"unpackedSize":18832,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsbxICRA9TVsSAnZWagAANekP/2ffgUca7HH03vBJSYP3\n2GI42HWKftnXMw5aw2ohoOyImtAhN93yTHi+HKH9VX9CLClFudcn5hHWPmV4\n1yRFNV1Bpv1Ya6sv6scK2wf+4oITJpzjVBdlRY66Gm2p2EWk2bQgM6bWttBW\nnKCS+BaVHbLMbyAOLv/sR7s1c0fAa5rkASXvxtfhkHN60uH3cODrCGeolcf9\no4yhALHN3mE7J3brw+W3t9j0Gpfg3ErB/BKL+U7aHpDZJATN2S5+Wcvr86Dt\ne3KEAyulS7FIhKSYwDMpjhpdTb74DLCP1J69pLQrI5h0sBu8k64HwQ4vL9Fi\nteFP4zrhCESCF+b9IxTuGQCOJtLt3OjVqrmBDC3fRc+mx2/S+qFsTXGXgLVo\nI3cTzmQi/kPP/gMfSbmWBO6Uo1s1InnMmFcXUDbAU9qG00nwOcOG+evUZgAQ\n/qB6n6TJc0PGNn1d8ty1FcOxiHYasYGwLKvkqMqPDi+qY0a4yk11x1gBbFaJ\n9SiEBNcXpVK/0uhMpacNch6IzczXn4ShPYzOiX5YCB787RX+fKAsSGN+R1PP\nyz5Klo+eHSVBwB5WsZe2jz6oBc0Da1ZJZSNbtIHV+6ORirgU+RM/eqN8QOr1\nWEHS2dKNzhDER2ZQbch2b4rsrCE18+MB/kVLyaldvOKVXwZyAhgr3C85UGr0\nu+WT\r\n=Qy1k\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCjZdSVv+doh42Wg48xqDsVvcZ0Gzv2T8+1x7dH8eq19wIgSvDsk+fv9QbF4tgme82Q9nxZHSrz6Qo6PBrfsrTZr9Q="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.3_1571929160530_0.7042300010003943"},"_hasShrinkwrap":false},"0.6.4-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.6.4-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.4-alpha.1+5c658e4","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5c658e4b4b3b55432498064d449eed1c34c2cf04","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\nimport React from 'react';\n\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration\n\n### Registrar Configuration\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // default configuration\n  await register(app, {\n    viewsDir: 'views',\n    distDir: '.ssr',\n  });\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n### `ssr.config.js`\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    // we can override the default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.jsx**\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.jsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.jsx**\n\n```jsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\nEach example uses `@react-ssr/{express|nestjs-express}@canary` by default, so it may have some bugs.\n\nTo use the stable version, please rewrite to `@react-ssr/{express|nestjs-express}@latest`:\n\n```json\n{\n  \"dependencies\": {\n    \"@react-ssr/nestjs-express\": \"latest\"\n  }\n}\n```\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.6.4-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/owRP6Eev4ZGkQfeutcpmfFSmWZD57Lg+TGFP0r9Wd39b/IylSs9X/5oFcUtdmwj5Xo135DAKE9iZ6igQZs0jg==","shasum":"3a94f4c2e8628eee6f6f8cd0c87781609859f75b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.4-alpha.1.tgz","fileCount":9,"unpackedSize":18680,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsfNoCRA9TVsSAnZWagAA9RYP/0jI4qiLIbgBOyhwEWJM\nudIfpGtej+A+5CpsuRSLy4IHYKIXGE48M2Wt8ivkW30JH3dOkSqyjgItpGyf\nsNdnuyBB72rNwyZPnbyKQcOoijZoO6iUJyhNiGPHtlt8K/V5tGGdljpBwOUV\naZRaLcGd2GfF3wqOz0D3pNqxsQtLXlyJrcp9HggeZcIH4iI5LRJ9jD1GmvuB\nPefBRackArg+M3SNMr4RqNDMOq0CFbtaQePatDEu5uMZ9b99Xg+/l6jaWYrq\nf5vuj8nT+FoUULLUjqpDMZimBTIJNJJlVMxJQKBWTR+ApnVllSMrK6AAbm5A\nsI1Gd+62BLHNdDpHSUIllAUIZrRAuUtMOb2tYIwMsEHLWqIpCF4bYt81uDDP\nCi92eae7VObAULSXyzXt8QhMbfnRzCG38mWu/ekfJH+yq01xbHJf3QoFf6KU\n2ahw4aBdCNb0qSbl8bLBf5kD6wP/d1FXYnFjO137gUOL4zpQR2fk47WZC+sj\nKTCIaDQ5ct0RUs9FmnIQATW47gfCR7bpzf8z+rgu+qlMRiWwVeIqgpOcm5lk\nR97EgQQhnCxL4uWrnqslCMCGPB68NGtkQqW/P9i6FL2QTq8Cf7vls2vQJgat\nplXs+BMtKTRUkLWFbmSaBnatCxwb83I+Vdn6SzeDXZDAXclwVn90Bb1aKZUI\neYP5\r\n=pKR4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCNQWLPh20IjenjBTFccmIxtypF+mIlPH/q0CufatQ2eAIgG9+bH07ZqwbnkwpzV68IHe5caLd6SMxxdV1Nuj7o1Uk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.4-alpha.1_1571943272398_0.04421021459871399"},"_hasShrinkwrap":false},"0.6.4":{"name":"@react-ssr/nestjs-express","version":"0.6.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.4","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f81986110f5294125b0e12849fcaaeb6006cf028","_id":"@react-ssr/nestjs-express@0.6.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-R62TOnNTRRowgedx7eJ3R4LXsqJ/Of3qk0+ij095cHxIGuF3NOU/hXrDNE+XXVdX0KBZ/XXafKEjGw5NXwVSBA==","shasum":"832838b3d213e82fa7d780c2a567f5d07b852131","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.4.tgz","fileCount":9,"unpackedSize":18648,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsfOdCRA9TVsSAnZWagAAJo0P/iBt78r25YOpdH1bzYZo\n237smkJuWk3jBFyohnIsiNo5/CjyC5uq7Us1fuF/Yq9OftLPCzA8atugFa9r\n1IxMrLty5PrNFlnyyuHZ6E+akbTBiBdaTWYnIX/VsFdXLPyEj1eGiM6WwLtC\n9zfLeL+sEYBRlvMBW558AJb8iKwxuv0d8El7VDiaurMUvE2jNyfJpUneBdme\nTEthnqNSK6A/hfydw5sR9XjXQYtxsqs3Wap27URwqcE1JY9+XKOQfc+2EKhg\nJai80HYZ0nJTP7Xie9mdVHl49pJ+MpP5TbdMAmsNpldOccy0WigQBpbHW5yd\nc598vicANHrxeGvta70ROCJ494X0FrUPxhHtx84/gTCs0KfKxfLvegV8iHfr\nNDE5+gpSg+a+BribWia6sKeDjB0YmT0mRYJjItPY0yWYPdBYr2gsv9Vgj5x/\nTRmUhQFDPdFKCh1ZxrF2l6k2VzZXnxWlupdxV6dBiVlSDicew4kDGrTo5iga\nZoYxHyRS6lR5NDZ5ffHA65LkHVMGf+rdrJ+k2JZPeyHmxOcjZd0urVuzJJo6\nzhVU2EcAfSl7G8W/CF8u30ZmfcR4f6JYBVQVN4xunZuD2g7Vn6vzhJqn9QK2\nziDqC5Tkp8+jEV9vIouGi/nWIsrLxUf16M1SdZZpaS3mTaA22oNlTnZGnG3E\n7QMw\r\n=0Iyc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDRl2EXUdcobJDjtiEhwb35WzXDnHYplHVIiCPHGserZQIhAMAmW90Jwqn09gbl07HxcE/KU2mb1bBzh9zhsD1M6hNK"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.4_1571943325219_0.1863588072214566"},"_hasShrinkwrap":false},"0.6.5":{"name":"@react-ssr/nestjs-express","version":"0.6.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.6.5","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"80db8c2237e90181a646a98b2315cf8d355286dc","_id":"@react-ssr/nestjs-express@0.6.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-KxMcHU40IJjbfJBh+xp13FWaceU4Rbg90hUhFBj+kFUnteGb9ko7TwClIr4Z4BC9Y6vu7dIVhdUfXzLjlEhRXw==","shasum":"2461ede17403911a492b8036d370cb585558b606","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.6.5.tgz","fileCount":9,"unpackedSize":18832,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdsfTvCRA9TVsSAnZWagAAvx8P/Ax1GAQnOOQj4hgM1Wcf\nyCbN/5WUSOTiMUqlWvlhMh7l9b4QgZgSa0qoU1MjZO9DvPu9/MOx6+b+J0p6\nWvNPDWIjP2StzaE2CbHs9VWT5rfSIjsLO7Y5rW5tIoTK7LHI6mIjIbUiig2S\nSHiLR92DgFUVLIgdRdpIlQcrc8btV9ddUfhwYT+/Cf3KF+4867VCj7CF/7HL\nXRpNCWdIi18c0qn6VQjl63oNSJrjvsXwe579dvu5rQ22kHhHvCcvRPnTN8EP\n7hR2/5ktsHxn1KfP6yR557LAv3l9hDb9QitDMfk42Abj/ukFYcChEDUnpKeD\nB1H3GhhqPQtT/Bz0NGO5ciIS0cDxYVnkNZsuXUqZuJVIo1ELFdLWBwFswdr0\nob6Q7rMUucngMM7TwGM3nbbcZk+AC4oL9LEwBUCLPO76mhLCxSAPQ2L2fZkw\njoUZOTCQa2alNXQhImWBLGOTHATQgJZ7UmaJM4t2M7lQ/NLLE3LtPNwWhud1\nh2nA162FXn8vcnXFW4HFdv4a9sIafxjYxgu4uuPGH2O39WxkdK9Gx8RjK6qp\nT7UrElVw86mVNdHZXYQX4LJ9DJdy+xPNwd8dFMzs0xAvBYMSHHTye9+NgQHv\nPLJDA5HtHEyQO7ppX82Z7BGItPk84fsAhq3b4VBMBG8c6x+lp84bYYLQT6tJ\nkM4P\r\n=XbE7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDeB1wtFMBelJfxBTu1+Dh1xzinEEcQxdRRqOLYnV+vdAiEAigQWfGkTeydI3aWWX2FaJpXOk71r9hnNat46ziWciQc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.6.5_1571943663338_0.77211852705303"},"_hasShrinkwrap":false},"0.7.0":{"name":"@react-ssr/nestjs-express","version":"0.7.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.0","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"68d86b4c3680c06cf7b3eabd9a0e0ced6ad719d5","_id":"@react-ssr/nestjs-express@0.7.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-NkhUq2D5LRCa/G/J64oijWEFMeyLX4HySwYAj5qTYhdj3fipwzXkGjZbyYE1V3fZXdWR+kU1MufkB0VheZvB5Q==","shasum":"2f0fba0fc329989823c19d2f25134e1487a6653b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.0.tgz","fileCount":9,"unpackedSize":18271,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJds6C1CRA9TVsSAnZWagAAgh4P+wWJCuQ2WgaW2IFkDRCg\nFWgfMXiJE0aMUAqyvLtHf8s2J8u3zagqC7FFbdU6cVJcuF5mcbvjnn0+JT1j\nRkKKFmCcYZC1Ox9curILlXEaNzCCDqXslCoy0Sth2W2mwGQzN5diX0IQQ58Y\nLhkF+U8T6yYtuMtC8DRVF1aIS3YilbjxPPwpY+I5KKpFI7n4azzt/zoE13ip\nPWI9qxyRSTSlPAVzKX2hOig+YszPpyAn0n0gskNgdOVZ8FZCm57x09ljID7t\nhjkp2Et4RXnU0OlIL1rrtftUM+uwMFsdwkirouTMBnQEGiZ6wjcGq1cg6+eX\ntZtENderJJBSq5BlwMZvYJQ6QR5Wh3Rn7j5h6TPgaQX4N3OKoYGpEgdnfWrw\nQx4rANZwXEOHV+QF/ON8RirquRlp5nS7MGLNDbfYs2tNqykeNDTkNJIWMLxj\nIWtfu5LcK39VZujqLeNQfzbHTwIhnrOL2BLnaWBUgHC5qORZTRYiPP8IyjLW\n+sgL9KJ1KSMfd7yOetl3NZoW+tvZbpI71q6UuQ+vOiRyqToswAKkmZHDb7+P\nbkR9fqUn4SJn6JrSrEPvoRZuan/HayiceK52HAEkMzchP6y7HHw0NpxUupwu\nUwxUBLZcAQKLcL0v+C8j8uR5RG+OQmoqG72dAsa6vuh575+lblgdh5TEKM2E\nojy3\r\n=hx0e\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDHaIhG2yprI71Ce3yzVELpYk9+wb5bQD5YkSgLwh6mRwIgMr+Fao+/m1NrMR40PZJXnb1w8uBcOOIJ6V8/h9M2Dec="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.0_1572053172828_0.5702108573018196"},"_hasShrinkwrap":false},"0.7.1":{"name":"@react-ssr/nestjs-express","version":"0.7.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.1","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9cb3bd66e9e0b2159ad34edecc72f4cf1bc43cdd","_id":"@react-ssr/nestjs-express@0.7.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-EZc30YUm3vweRxJgjOdVEA+2hLIi6Vej4zDIDB3FZeQhVd1hUGqACA5IBxTIJVNN99EfYlziRj1R9/u+pYjgng==","shasum":"b59d2bd8ea1dd25c61af70de1ce886d91c256372","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.1.tgz","fileCount":11,"unpackedSize":18587,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtBKXCRA9TVsSAnZWagAA+TAP/06RKGxQQOJibIlXv7yI\n1WiJiyrghV6KfbA15MIFFTuqrPARSBn5hFZHSNVItDWzB9H1nkasmOw3Ef6+\nFkuIYuoFm5vOd4r54twUd4kK3lniUyVinrzi2PFeTtGOI5L1U0ZUqVAY5HSl\nYsdKii3IwjvPwShw23MOS5d7Na+5u8wPbLtZ1Sq8k+Wr4ECoJFX7SdjDZEc4\ncULjpjoDIW3yL5DZlSfSUk7Daz02Usm2eaqoAFj3s8LS+Z5BLwGrD10iF1kD\nWIfOCfDqvvkX/vHMKCJcW0/7DG6grrxDYBNwTYenz5fVqsWpQCpiAX1HbaBN\nprNe55IpTqYBrk8UDYXNCNJU15vRs2tfE4LMMmQp3Vpf5r33jmjaL1gKTyTb\nB3fUTjudsBdMUaTOwqYMy4Xc4lZiFz+D00r6msc1NdqVE33ijEqtegTJtxtU\nJyTV0gqnj1QMyGNQNLeMEVYD5WDkMKquN1iqvOWXiVPtZTskT6TI7a+dDGFE\nWUQaYkmwTON4yUIy0Da4OK4g7fXdQ5HmRjGL78vjAg3JWs7puvXGhSbbtaCJ\ne6AeJPGoWL7gmBXb/7VaXRB1XI/Ak51ux1tZviFkwPj0kz5NQLlBeREVJyw1\ncYnz7yIx0gLHNwbWwJj1j3C722ernWvnyreW9JrD+hTCbn+LFIAW842wJMxG\nIj7I\r\n=WS+V\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAIYnmyfy9POkF5oyLkBsN00bDhFNfSlpgr4XK3fvZRFAiAnyVqtPz2fnb/CJe7nBeMx9xXWMzdznQ5STzDCeFGXTw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.1_1572082326505_0.305021869982564"},"_hasShrinkwrap":false},"0.7.2":{"name":"@react-ssr/nestjs-express","version":"0.7.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.2","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a91a227cc2d15c4b958622da247f40c181093b12","_id":"@react-ssr/nestjs-express@0.7.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-XXUIIgWpcpLIdcoMNIEHdE08uppOlgsJ/7upAdhwyag7h7e7/BIdu4RMNTKnCbZ09wSfuXjy86DPJvvEWadsbw==","shasum":"918170149302b2caf32ff856ac64bf6ae4634e44","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.2.tgz","fileCount":11,"unpackedSize":18587,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdto7rCRA9TVsSAnZWagAAKkcP/0xKhlyC4deVUvW2XoHM\nDdfyT7fIpe4TeVy1itg6wyhmGSzjuGyU4Sb0SSQIXyt7LE01r0YANQlHqgkU\nibSs/2v6BqiUlIVd/KrKeaAkfTC2Vm2Rj5ZMBg+ixDfGRFr6+um/D8BmInRj\nPUT3TuUL+AGzd0bv6985D7TSw0dWeVH+KzUy21Xh9Y+re42aRPW1bWhy1Y8C\n3KhDka/wGSTdCcbvu39atQsnVcOkcaJdnt8iT6dRJeTWCinX5lAwXzW0+OfL\nwCMn1LFAv8lgAqEVr2soBIKzbQxtM1A8kO9ocUlvTWm+sPAavFCQgtcEp4l1\n0gzwX8qfgG2LDZ5676izOlkTXL2yNPLA6IdsC4k3iiJm4mB1xpV/vQTBeX9o\npUxYZIOrwAXu9L7HsxVocyl2pjbgeuQIpz7eIZfzXVRDBFYhV7axQY1PXX3f\n39ZvHEA4UklyCIb4r4AS7M8zL5NLWb0jNjsgUiBRH+3W0i8iZ+063FkPoX4k\nhcezS98OV324OFMTqF1WqmLX6sIavxKyvTBL3/Xze395YmRPhxneSEpORuPl\nQWX1vUCKL6Q9VPBdjIbeBVnpiyP5T/pMwsGOsGuXd6PwzFoMwJ5ZquExWEel\nv7VCtxF9bntz5vstZYjxdBfB0vdpmEEM+12c9HVy1mrm1vrYt01z9LS3NBug\n+MVY\r\n=mcuX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCciHJmnaDj0S1KyzTr4S+OHViFVZdIfDB+laJXdnzyEgIhAKJsITNpufKqcrxSn9e0a7GE1ydhQHHO1gAJ3IH5WnLu"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.2_1572245226762_0.2229081795642036"},"_hasShrinkwrap":false},"0.7.3":{"name":"@react-ssr/nestjs-express","version":"0.7.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.3","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a3ae27701c0a295893848ac5979159033832bb5b","_id":"@react-ssr/nestjs-express@0.7.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-f0Q3k37RcbzYfi8wBvRnKNOGtxsOwVSTBoVtXY56DlPrnj0bBho7/MmXy6jLlBFRtR4iLctpIr2ERyZV/+ym/g==","shasum":"cee6987a8c372ca0db108ddec37d0372a052cdb0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.3.tgz","fileCount":11,"unpackedSize":18587,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtpExCRA9TVsSAnZWagAARyYP/3oM/1wHkYuEYEfsueRf\nPa/fKkako3zzPntirZPPiSftILeYwVlSTY3Q3EOXZwVXDtFgUOmaGMFnfWKt\nsnCV1Rs7UCTeLZGiudzG518FC+yJ6/+uKNbi6cJOWuI82NBl3hO8n2zsJx0j\nsQPLGFvcL0XbswjviLatwQxU1kTAT6AJXBGQX2gqj2Cb0bqwazf39kNL86WT\n9JHB69ouV5v/b6RaTUkqseECLM2KBOr8iKTi5b9erZpWLClSlUxiymfAkmmm\n8Iq//aZdYvHYGflnMpjA3S3NEHRSBHevwgnywkaQVgHPdB3133mGXY3U6v7P\nkDJ2ai/yey47HTz/IJKRno2G0tDXDmW9iAmBNJnqxVJFrEHMzsWnwJmXgPks\nlnfBe843EIanMoVmIULdHcswvZgro9wu3vvLZNKhwszifutpOjk+8OM1z5l7\nJ/TsK288SWk2yWN5yBs8JPuf2jMjD0+P9ICj9pZkLGj94k1i0+DoNcOVqIak\ns9MHSkwFU61prQ87NJVHrefnurPN060jGRoW0Dt0gSZN84LuMLKTUCo5LcB5\nETNHjbCZN36Wn5jeKvS4hoiWRdUN+qmexlcrcPiuMEag9W7f5Y5EbKDHdB1c\nmOHVJkCrznmsrTE3dAFkZzsEJ6SiLYqvQU+FNqPZxoeuoQDkjdcGrS5IlHtS\nHNg0\r\n=mfWm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCzuyi1omfOwfO5A78GXWV2Cju8wFLi8IQlNK6NdVTE3gIgRL2mngOkkmuRMy6KDnv+NLMVkTHmIOUrV24hgMEZZAY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.3_1572245809292_0.7994115461032749"},"_hasShrinkwrap":false},"0.7.4":{"name":"@react-ssr/nestjs-express","version":"0.7.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.4","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"fafb79ca95814bf4b63aee571817380bf1aafd61","_id":"@react-ssr/nestjs-express@0.7.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-978765HVg3KI8oACKVChkfrPrd7ozbLVHWwJnhbQl1jTatdS77qDrZ73dOjWd2Qqx2Ll8c6hkgWnbufCZisZ0Q==","shasum":"f1d04b5fcb3e869e3dc1cf1672fc62d345522b80","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.4.tgz","fileCount":11,"unpackedSize":18587,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtpJqCRA9TVsSAnZWagAA1v4P/1TY1zw1j0a/PXlEhaA4\nQztK/fhM0vpc6T6RulqygAYaX26bFBY/fSd85Dn7fCBjQelmJjFtBQAbuqlD\nNHxpraCLw1R4bvZt6LnCGNvmkPFZCWxnILYpIx/hUJEZgWhlw46kaP5YfLbm\nNW8jbEKghK38SFLDmEuAaYTsCPDajrAgAY/Xr9K6Fvqn+GBQW5atgZ8aOnr9\nGvIz+R1gLy2X3Ph1fWgsDcumK4TA2HMpxphgQ3o0uF7RhjNt4L5rAfcBIt7i\nbV2azJK8D3Hfkfa74mq5gJux8bHM5s7HCQy5kg0IYLNVeCanxCrmii2SrrY0\nKUr5TbXQBP5BWbN3q7FYE4su7zUDsZX1RrzfcobFh6Tn8ONaignEGvC8Vzdf\n3CK9LhnQxvkCmeKs+b4EZhilTNJRbqXvl1S3U+D8+V5F8XSGnmmdsE8672xw\n3R/4bV1UItzl+yTQjzpewHQcqdh16/2/z3QR1L3EOX6wVGmUkZboF3NB0xnX\nOfmSotxSSZFGDteVftC9da+4jWCyhooxtFF2voQ3bu91BfRXZBX0/dU00eST\neirr8H/s/XdTrZmOPTnPAyp4aPPJofw5gOvHsYWimyLqQ4PWJmQMJL3E6s2g\n8oXvocPJHBB/n7tqfs8iTeUQnoYYIFlYszdm9/QC2TxO/SPfQNAYuD3AV6M2\nE9/i\r\n=+A8v\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCQDA6z/91g3iKB/2gpkXbIxXSU6gSKE2wZrQo13fa3AwIhALqL8/3fbb+7CF2j5fgeD/aYI01nXwV2MWH7vAQe34Tr"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.4_1572246122411_0.48535296120211546"},"_hasShrinkwrap":false},"0.7.5":{"name":"@react-ssr/nestjs-express","version":"0.7.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.5","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d5c008441737361d2883355a32c178ed6168dd98","_id":"@react-ssr/nestjs-express@0.7.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-nRutyKBGnVWVecWlp6NtxOsK9QcwoltMuixxGZhJYQMvir1CtNv8bAhqDWGpNJ0lwR96kHjSuVGqtRj+Uxp8cg==","shasum":"97dfe843922c95c01573d515292cca121528a04d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.5.tgz","fileCount":11,"unpackedSize":18587,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtpMmCRA9TVsSAnZWagAAyycP/1RrMRwxCGy5MKtNxwwQ\nkrcu1Rr//Z2MIex6GAjW9GlYgD4RKz4rMQoB4UtCUV/Uyr/ADIOdPJGs66S1\n/Z9PAQaXo3qMOU9LpsM1uggboTDn20TL0jfRjLRuoK9XDipNW0LLUnxfiDVw\n5i99WqwctiVPxey5Qjjg4FDlEkeE1tPXyfVJjb5cwFAfbmsLW/pkORxRPMGo\nC5E2+u4vgM72F/R1MD1Ye6SXxmn/O6DfQ2Z6EKiRyU/1XYTrqaj3OYc2VCTg\nnAq05yOA9zZD3YpdRMRF+lVJc9rKhdTCAFhNHS2u8HkaYZoFv2qFZKLQxAkC\nlVpzjPJIHh4x1EBRMK1AAaF79M38GPHCOjD1bO7jaPIYJgv0Z+JIsJZI6U9F\nH0lg+s1eg1DXMnlTZqCTn5CzycCBg0ecsHNvRO8cg9IKMObNBcK8MMwROpuj\nYhS7oJJpWZCtrOMI8pptn/D4BTbuBGOD/kSdLu5Ri6jYmbJKxX24GtMNdLH2\nTDrf+Rdil8EwtEC4OvIIRN6TBxo0seX92f/F3+ECdXdRZRo90hx59DEQkvT0\ngV/vDmrsQMgzJP6z6jArGGe5N4ThrQ0FIs61CnGUAbA+TEP5UBDO5oQyff4A\nGYoum88MLS5OSScvi2cQwDqspc4JhSjBHOfvirQ/hY8YKw8oafIkQimJS7EN\n6Qo4\r\n=UM74\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDscdnE9aVyFw0vbeMfYID8nhuaa32OcelyTiZv3wOIKQIhAMQ/IwpjiJ04cedOw7CCzZMAqQ7k+CLIwtIVuNeua/z5"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.5_1572246309743_0.16720863199905112"},"_hasShrinkwrap":false},"0.7.6":{"name":"@react-ssr/nestjs-express","version":"0.7.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.6","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d2354011255ff06d1dfa193aca9002ee3bb6ab66","_id":"@react-ssr/nestjs-express@0.7.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0wJzRtA0kH9nxPyQe8f6PhsxuP5SUQRJ2Kmv2hagSOckvgHB3a7u/5I+bRaoNXkgbCC6Q6Zu1GvdazqbaBGdTA==","shasum":"c06da103c9fb71756d741c3b734547e5d70cd93a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.6.tgz","fileCount":11,"unpackedSize":18310,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtte1CRA9TVsSAnZWagAA4+oP/R2BIVRGSYECrz2vIA7d\nS6OyWY+gsvxnRzDfXrVA5TF6ikFb/AcN6V4Mye2GWrXa5Rw+PFR5N1YJYdtc\nphovC8H4iTwCj921XhVitRVH4OHBKUNg5NS4NjMjL+VwmNWRB9JIFr+DgAsd\nYrxaS7HG0fICW9m34PtX9hjQrl1kzi36ywqmoGc1gheU6YV37WZWsaImaiXl\n77Ofs5SiRMrhxMhnRRwEqDJnqVLHwrXYWuqbKS0GQ3XZZsZj6GUS9PmgGkRC\nTmzzB5g0Fce8xyHT/sc6tNdD6/LWJkhTQ79JF2gFQxj4/FuB+eFreiLK+1q5\n0j15LFq5JGiQaBjWIsAIkMTaFvc8I1zqTzgBOh+yJcuDtlth5lvWlly2LlzV\nCBr6xWp8i6G5i4SrRtIfOItt5Bq3edbSBpKvKLVLUI4C9lUlpxH/6dlNwvAp\n45XVuIGZPio1SLiZHffARXEObTKA9jYUFryh4Nht02Wq1hHu0a4u3WZ6MgSh\nVBhTQmtT7nzTjMWp3Ih/BTD9ec0SLopUZonL/pxoJpfGRcxxx0PQWo6SVwEI\nkMTrSk/Lplklfk/MlMIN4TFbB7iuZ5DddVeUmtov6YyLkObFv9bLD2ce9FPz\nFanhGtCUzBvsoBe/JcAvqNvUcOa2Pch70hyu+bw/oorrj1e6nfm5kikSlmNP\n1akG\r\n=t0IU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDOKdCmU2lc6NTjmix8txXPfLukyIqInAsjlFRCHNKTNAiEAsUACaFkXIpESdvu1PnFn82s4JS/P6YUI12I5VaFhUJU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.6_1572263861220_0.9873844456417378"},"_hasShrinkwrap":false},"0.7.7":{"name":"@react-ssr/nestjs-express","version":"0.7.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.7","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c672f9781cd21b0bebeeacf9d333102ef15afbe5","_id":"@react-ssr/nestjs-express@0.7.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-3MMm4LFyEc9R+MXAW7VVyRJ+ebY5RxmJYs8t06vd6jesMvnk7tZOdbpwQQa9j+1lR3gU/fS3G3S2BHISAv9gVg==","shasum":"a208786c8650d66665505e63021bc0a84e546aa2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.7.tgz","fileCount":11,"unpackedSize":18310,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdttwpCRA9TVsSAnZWagAAAbsQAJMQRFQ4r31QfSM/FVUT\na+B6nigoTph0GmkuYrnzol30SQ0sACUVshTq4k1NNq9TuZqsioThQ7cfiMRl\nKhENxamV9D9Q9WLGGpO/hwmXWHzXTEB2XscCBJX10VEu5DZ9zjutk/G1XtpJ\n78ajuUnrYnQvYuGALAJW3f8e1UKbXp4A+XUfWSJVtZH7FIfMo2cXntxweYuU\nRkz3ZRNIZ6WJDclvRuMhg7y5MHD/iMvpyMzvdjIPk9d3Ix7gRsQeFZ73z8rb\nIcBlckE1zMIV7ptaWLnlzyJP5rQ0GPVvvjEQX8rQFc5K1RA7QUe6rJQXmo6Z\nFDaKIDM7RakMwqa2Gd8dxXdTm9h1R13dBE9nJL43zhEkvhFaO0FukDWfi3IS\n3E3FXOqVZDTthIrXKZi2muvgLYAzwcwTgaKm8wBPi6Z/OCDdlld45TfuVnqD\nvUDOIWcHm/HPIKji73A769kRtBeZ/SDdvhMBZ4S+tgR+cZ/LdsHCUMQNdLQj\nhI1ctAo8UZBoyracY2WpVYm9a5D+kHrFKMGmih0OBx8gSjF4D2wwOTqzBoVN\n6cUoM476/NP6ReZFR5bSkTJ/GrXLvL7zNIEReoX1EIUGDfOYYnyrMJueKhIb\nR4nVeuuog2J7QmlXKh3w5w3C/+/6xqmvVz/7xZeAWy9kNH6FajVjuOBxVOXc\nI6Ln\r\n=CIWp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDTl/sSPwI1UVsxVYTYf/wBw33PjUd5svdtUN0Me76C+QIgeQNJL7k+MNsUfHNGzErn8jz3N/FusjlUnuf4XySBiBQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.7_1572265000806_0.35819107359688296"},"_hasShrinkwrap":false},"0.7.8":{"name":"@react-ssr/nestjs-express","version":"0.7.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.8","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1aff0b170c5c1befa790ef057d42c901d62a59e0","_id":"@react-ssr/nestjs-express@0.7.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2pdasvah5WBCbtkWJcq6PKq/3aBgPx//zZnlLAJNvgY52zijJ2NMuQdnm7cGD+JBvXZ+6ZGfjVilTbvu5+1TQg==","shasum":"1686c444464fb5d8314426b5b5b656251f0bf2a5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.8.tgz","fileCount":11,"unpackedSize":18310,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtt85CRA9TVsSAnZWagAAG8AP/jZ3lQbNFZFBoMwq/MEF\naxMQmkyuhNt8qjCEGHJrLuL+Tu+xivIL2nPHRrgkjyYDVL1Ki58t1hLUUjRP\njKh/FDYIZEYFHOj35j8F2R7ZbeEZyDljbunsEaScuxXjMPQQvMK5juURUiW8\nds/EpzocbkvW3dryE28ejQo6x/kKqoWCYN09nj+IvWOdW1MoOIELJfrQiOIG\nv0UKXgYH6nj2CnobUS5tJ69SzTKHV4oEx2fcXvhwuVoTdDjljxc6HrbBXeTi\nd/sFcCEW1oDO5GIuRjAtLsv71xcz/dvCIxljGUifaUBeyI5CYBuUkM2owbOD\nwznZ+eAYeo7EHbzPbTkXMJsidsvt02ty9rAhUpYe4V/GKbTzRAj0P5Ki1dx8\nKgOLGaJV0Q4UVyXR1KPpzHw2vgRbBwVNaIIZDRrkVNxMoky5ts7ZuinegpXZ\n38va+ci3BRdqLFcwRQQuYA+bwuSqH+brLIpJiSgjSAVdw4/Qn6rChmtdsncU\nG8tMmkUB0Tm30zu+a0h/RfBwUMsy2uoLhbvH85IKraTDvDZhy63JwF3o4vHN\nkD/9eLurchx8BuCb1IATRojlDgp4Ki+hc8KwbmF1Zfk0GzqIwlyCuGAcIZf7\nZHQwkokEczRFhuIRRtRUSc09hM1lAlLOEPHW4f+ePCROQifjk/NlLMHQU317\nVduB\r\n=m8Gz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCVim4JQC+Kgh1cvEJ4o2cYCXxVoND0u8bWYHXPaVV9yQIhAOHsW41pYbXb9bo06Bf73U52jkJ5q3ydktngNcI2DC9x"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.8_1572265784806_0.6828368907777813"},"_hasShrinkwrap":false},"0.7.9":{"name":"@react-ssr/nestjs-express","version":"0.7.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.9","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c54bafb34f38db0aef279212a85b40b2d9c3d0a1","_id":"@react-ssr/nestjs-express@0.7.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-uwroDK2NMAe5xXZWrmTR8c2LM7nVXfzsrFTxoZAp3vQsssRzc0U/cOPzizLQwbLWC6HLOtKPd9JO3J6s8tEG1w==","shasum":"5e9acf435d7983dd410387d1f308693396b3d371","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.9.tgz","fileCount":11,"unpackedSize":18310,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtuIvCRA9TVsSAnZWagAA2A4P/3gK7OV+jLqmy62Q+3NI\nUq41bUnm+2ADj45rSCvHt5i9wm/2WJc3YxSzz11DLsYiUg9JIln40NdR9Buz\nv3GDW/I1O1MqZ7ZmapYoDjI5nk25y+uX6a+2IRQS5YT7DqSJ/Jw+IP9HEhEB\n3QO7xkUI4L8RpFvlZXwDkxW6rTBiXmZRQMDaLbnCUEK6hNLVpqtqBDtQQeJ9\nia4+nG6Y/OpWgPWTnPJpwmxPuxV31KWCYmBgJeSJG3pIWsTg/0r3jxBa/lph\nYo6INoZ8T5ADWbzozy5yXsCH9xwF8JoEeAdNY4qWJy4QhIKAwh59BeoOIYuM\nVt6aiJDWmpL1uSvsJ+dHSGvg9iGWkWmtrmjwgBbzRSxKkEWXiU04zdbiAvoc\n8cF032QUzp38HHnyKA4DV7xsDBDsxaGBGdYo+fuqXeExckA+TaK5KQTSqF5g\nK8hj8yb1QG16O+KsfzymtnDXTzAPbgAt89jQkXfavnwROQLLu71aDfpPGBUD\nF9jKE8EQe/fKvcybbyuaqrtVFr+1Mo9hzpOWB3vXpdn82uFFKveLtG84vWtc\n6FM8STe7lbfIisvacx8intKPpO51rSmGaKhTX2X1AJtlAmSBuoxbE/lK6Nct\n9L4cPdfJoX+bF1AHLKJeCbtUFH2yBsc1MP8xWxypKklpVdCdiJshCir40aY/\nnkGL\r\n=llTU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBSyEAszenRk++draZ4EJN0OKYJU/3xsJIBZKkmx+08nAiAeOmFvRYHnCmTwQ/BSldLzmS78VtFL9f7e/ALYXfxWFQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.9_1572266542845_0.33544731490013224"},"_hasShrinkwrap":false},"0.7.10":{"name":"@react-ssr/nestjs-express","version":"0.7.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.10","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c9356bdb7962715baec2e9edc28fb22d80dcb34e","_id":"@react-ssr/nestjs-express@0.7.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-DPeLPzHeqfyw6ASR5uZGEZxtls+0SQ0tu9FgtrPhDUDxcIHNuESpCxTiFqDAfn+uDQBukrN5c/AIeQJrKRB+Cg==","shasum":"6b19b3f5f865d3a48b52e3d1f975282b89f70c56","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.10.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtuSnCRA9TVsSAnZWagAAdo0QAJLRzSP7GSyxFeFvWs+6\nfgMezLdY/1WpyHDQQRd8oM/nFtNkdwLCOlGMcie125hqX+iJvSvr+ITPpHm2\nlbsmxk4+kpXLc5qwqwksXFNtjTfv+GQAHJCa98CUsrD2QSQMxc1Jn1UFnWLf\n62U8+BNX+VVmGPyO9NNTy9ZgLUGyUnDBq1LCo5PXHKmMJCQF/rohC0oxARFL\n1WNnJhyRmxSVWqpvksKJY+sZKiCyIT5y0S0uzjfOndHf0v/IFkpFz+5sWN4d\nTocrfJ2k+R/3x9XQpyJS2yt8GPIAIfZrJmOH5UJrluJpCoVM99FiTGoI4kK+\nPseEEwy+kRPgRqeLQ0NyoQNC825hkMXoqdwhjmPrZqejVqa0IYLz100t3SoF\nly9VVFEOnmQXAD8qdP3RvkKGBliZ/PvA2jZ/86R3XEM0C8DlTJSMToZAd3wq\nxRB+RehQhRzRttB2FZzCqcheBeaAu0SmqyI5W48Yh5QGTLsiveAOVXA7NuPz\nxu7DLxRp4FQ2iCe1sit+LhMAe3mlDPh9zA8FxlPGulqvSDUdRXFiY924cHZd\nFYzp8MDLz2+iocPL+ZUzDesUtVMhzis9bJ/7KN9ETAif8FHPSK3tKCdYrGvu\neZ/ZNchZgBhaABAQEsxNh0avfvcA3Di7LiZy1tKSWyXCnlXIFexIPsmANQ4I\nOa9R\r\n=x4KO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICval78C8QizWwGSD2SrB11Ijp2F+Hf3okKYtHv/zYGLAiEAjkhoQcUVAXSiGUy7rrLyJRrQL6h7HaVIXJyagHtaMu4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.10_1572267174875_0.4320769776981557"},"_hasShrinkwrap":false},"0.7.11":{"name":"@react-ssr/nestjs-express","version":"0.7.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.11","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5d3a419293f1032bccc2b85c7a12aa7ba4454900","_id":"@react-ssr/nestjs-express@0.7.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-5XtLmk7nxYh4bqmicr6ptuas78Zbd8dpEJjtJbzjB3TbZaoVTaR+OhDKZ7AeG3Dxo620859C9La4KhoQ49HpSQ==","shasum":"09b3842217a4ef8c1653d257bc340587c678fff6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.11.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtu3xCRA9TVsSAnZWagAAziYP/2Bs+mZMnDUf+ZkZsQqw\nE11LZsfBwooSuHUhuJOdFfM5dLnu/CiRFc07zX/uTet9RP/thIHtA/0BuKm5\nSwwu958lzQVhbd5hQPu/Z5uOYtCVPLBepqKYd/8u1SFsoC6Hoq4CCgrTvoKU\nksxHPGwJgxaeIQLbSnlf32fRovHA+h1rDQwS6xv4b0TSHAmOMc0Nf4nachcP\nmCt33HBLC4GPJ9jOvIt8Y/XXwGOsfGAvqkfwERuyg4b6mfSU6RUMaq4NgT2M\nqNURuKczvDa1jRhzohgZczdYkiJsRg0sXc7Byp243WCm8HVjvjTznBatyH89\nRW2q8ZdygW1qm/rM5pOXsNfVC0AI335FPToKXsVwzBwUzZ+Ob+xCgQui/JeP\nCGQTvwnkYAFvq0vD3MTC8MoOcQlaZcoxXaZBw5V23Khf8SSVwhHubMQhfEgk\nUCYQsrxLLhqNmGHHkaUkOX0EOhw60oKNg/r2wpfnS+yv2kGq88LUXU/MtjdB\nrVtIEOH/km/O2o5AdrsiIhGQlOuJXhOUnn1w7iT96pkDYnjBf7B7ndMbvIM/\nGjtddwfLMGlN+8tfbcraGTczQ4g3My00w9HX2lYlhv1F/Z7sRITIqFh5WfBb\nIQ9Z71RIcSqFRVHZMza46sl8kZ7NlSX7rCSarmgDVjvU2fUnYTnh4Wa7H1V+\nt0/f\r\n=+MXM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIExa+BhsPl1Wrh+axed/qCgX3dxn+Etuk93X4+RyFjrwAiB3ent6Gg46qxD6D6znUIXtzQWh7KArqHJqfyhg3ci7oA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.11_1572269552897_0.9654445178691899"},"_hasShrinkwrap":false},"0.7.12":{"name":"@react-ssr/nestjs-express","version":"0.7.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.12","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f0cec7e2fb6d74e70d02685af438c34a74dc7b78","_id":"@react-ssr/nestjs-express@0.7.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-yxNnqQtGjHPGMdXyO58NJSYPRDOoFe3TBd4s0kMc28HdBn1DKvpmzI+ntPg7pc13Ny0zwYCJLV/HB/kk+y/MzQ==","shasum":"3867d86c38fd4d9c07d73c4b770981be923fde60","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.12.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdtz8qCRA9TVsSAnZWagAAgNIP/3W/6zdnnoyRCZZqtKMI\n5nsQ+JhDuz0Fv8C4g37ynZc9lJu1ZvqBeL4j4kj6uAPaVI3RBBOxXYR3gm03\nxwGR3o7rAow/9YIY/1B35jRIKywVwAGL/RY3X5VuZbLKcbOLCX6RTe83Z+kU\nwuNb8+Ub9z8e8FF3WCFcbLJB/zJRo1a8zyG49SqrVZB72anx8NuBRtlSZoH4\nPxHncGPeIBW/ukdEP60rQqmA6NVBhLrQzyLpYT7Gkb+HhKdWD5c/IBvFLo3m\nLOHXIDRU1X6u72RqTSBPRLLr3WRzsLKc8pyy2CVBQKTPHgC2jHChHFFGNXnk\ncXm/X7Jxx8LBT3FxCPvLvp1SKUS46p2oj3Gphp3s5zSAP6MmSd/f7kOeUXMR\ntZsYKJbtxBA2WleeIkYK7tPo7/liY49I2UdxMeOe8QhhRZEOAisGWvRJM5Dm\nVm7ilnCRd3uqvnIRyZzr19answ3Fkp+yHNJ3859165DQvDHw7bw/2VgbDsKF\nseG/e4HarzaRycwkWYrrfZi6UDxTZHIA1rIHMV/VnwwPPVmWdnOHBdK/FuFs\n7S+0mGVUoy6PFFZxwAVq3+UoVGKXDrUTuRGeY+/4PMNJrNgzFNceidMFUSDX\npzomDVDzK3IZYR5+v29PF/GHsFE6NSyNJbQ9Xy9wbm8FyLeY5kbJgzbiaJw/\nP9+N\r\n=GPZs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCH95Ql3sXM+KHaBXRgfl5v5Rll9MYFzwWV9J6EOnhl9AIhAJdNPvX4NW+EguEOPKavO/zSJy/nSQ66bkCjtmVS9tvz"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.12_1572290345847_0.16089169925819236"},"_hasShrinkwrap":false},"0.7.13":{"name":"@react-ssr/nestjs-express","version":"0.7.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.13","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9a4bb8a38c741bbef8515797bbca89006c43ff9e","_id":"@react-ssr/nestjs-express@0.7.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-i6oc4CSWOlQZdQAe46YbIzQDbCjon94DY3IEJl9pffzplQm3jECCg3O0nBoEFt6eLkPUPrJWnPDgGfM7GEkP2g==","shasum":"74ec8d65465375faa942f9a3b1216d11b61badd3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.13.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt0ESCRA9TVsSAnZWagAAM/UP/2fTqkPkmS9IdpV++hZE\ni6G4OL0lV28vOUxegDDgsWJWFnw850hmda7DFKBKipZ411tlMmY+yQESbtUT\nVIQyylrBfBJBj1TRwBiGcDnKoLJ3K2UCWEuV7kASYsmTa325u0qO2RpmljGd\n6W4Pg2iIW54HqCZbqH2aZKz0DmeL5e1U4kou/0xrHKHIeblwCJfiipAOSfOM\nodgD34oFfWwD3LplbNqhrGmWtnpy2RFvOXjL7qpX9SqXK2fni02GSVVfLmpA\n9wJReHbEZTJSP4/6KCHcnhdXXjABRpoEs8CQl/L8oJhSPGck+OkTqTGKhngN\nUZzwWcJWWUOohWSHs2KRCxXODZxX+0JhUYQnbbQg+gBraH7Navgsbhq8k77l\ntqHdIJWaTUTUa82/d0FY9XR0Wip756M2+LUSX4xrs58Hj9gUoSGVnf1yt4zQ\n9rhtsXZqqy+VJxqMZqsVP1G6ef/NAKTSpQ2EvHxFDB3NHolQhKshNpWAZGVf\nDb7FEwXuQe6Qh9lekqHd3V55EEVRzLueMlIcS3rQr6EOIEy7yqjO8mvr1T9C\nZDu9yvD/UTbD5lnf7xN/nPNwvbkPkK4YneRcWn50knPgswZk/vjsTBLeGw2b\nArQ7uDHi6ud/+smbuIEgszDSasUPdWHboADEb5UDFpl3McvtCWaiFsdDWECe\nTRzS\r\n=3vYE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEebyI+Xo3WFu9gymHAaSwVFp+6R+scvIVRPI0nFMMB9AiEA4k3d/CXOfz+n9teDgYKsrDpPgKZXMyWmO7ldZOzZgz8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.13_1572290833883_0.5688966616923732"},"_hasShrinkwrap":false},"0.7.14":{"name":"@react-ssr/nestjs-express","version":"0.7.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.14","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c203c66e0cb8ad1b29e4525f97139a8cf8d6448e","_id":"@react-ssr/nestjs-express@0.7.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Y4OLOtGvyNEV8GWJ7I2sBWwIxlP/lJjbTi+w6JR6CLhyDFS1aHsANBpNSx3NbzdNy62pWjWNFQiLHhSqT4PQeg==","shasum":"5608d25502a31798bc5c0befa9e9eec749932194","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.14.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt0LvCRA9TVsSAnZWagAA190P/0UnAWUg6hRuJfnc9hQh\nEDzxBk0tv+vTJNA6i4RWYWELS1AgQ/U75gWSq6AdHYNLH5sOYULRxs0TRcWq\nNKkJM+QnWGDgXP745JTLy6IFzbC93+nrXoPL1YvzGVMpUAyMM5bSx35AcXoj\nl8H4dmTWWm7A9cdA60v7H1wr7FPwHowrZ3T4s8LruXSCDDywu0zx4Qi8tKF4\nAw230FDyvN76qSSwd2DVSMRO3tFni6CD1wNMxf+/iYOcxfcjYmwwngQNUzS0\nAegKM+x3nrZUWPgOb5tupUcj6uXOvJhzK1Bk7v3VYdeAjTrYHg8dgjVWFbRV\nbZWEt6Pk+UdwBqfluOnX2B8fFrgDLgOK/8AEAnAl2kh5yUB+HPn0hlkDoc/z\nlBfI7gGsvh7jWcMJeiXTCYabjyAxFpKvEc8QH0E5DzU/I34IwS9joKH9Y9+Y\ni/BkrKG6JcjT9N4v4ksWFI9BOdKYEGfX9DLVSDjawykLxUE7/kFl9kPbeQIs\nJJujSLhDCGxrqMC6NyY4fP45g/9Rgobg7mWolJE+RRq7V+jvKe/XMzWaE4RT\nexPq2x2IPHioZD6Yx2eBVDRfbxexOhTLatZP0FQ8i1a3EVHdRQCTF6qXxjed\nEs+5SG4OjnOZ5xJwbHqEOgyF4fGBVvE9ja2R108EXvcIxQIeIHo3X8REGAWA\nwPiO\r\n=ridg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDwcfgcIm1meJbM+6LHZ61R6gBp6j4pDF49sm9F1iicVAIhAJL6n2Ux7WLiCW/kfTal9xzHL00nIvo2d5kOAZwG91HJ"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.14_1572291311347_0.8191631238561718"},"_hasShrinkwrap":false},"0.7.15":{"name":"@react-ssr/nestjs-express","version":"0.7.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.15","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c52c16f57e1758249264ddd5f9eb55efdebe620f","_id":"@react-ssr/nestjs-express@0.7.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Y8jpp7RDX4pi2LYAQ3/EAd/96vdfr4U9EwO4e2u2cdLacIV1/ew47B3N4mQxxx5dYhmxzzQ6wR0Vbn6nvuOa9Q==","shasum":"a6de14b6920ba9d5e8acf8f3250c083b5c3b2a37","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.15.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt0N/CRA9TVsSAnZWagAA9qoP/1/7BHS/Uvqh77lgoxU8\ngikpihD9QWoSCDsyKRhMNFtYemsq5BO51jdxLHObs0BkoeImVkwd7klYE6lC\nXb+Ew4kGBsn9rtCtUsZPSYQy5SHUyosbhyCgTl+Ee0NYvtAuthRoSCvCeWSR\ng4wtusQjsTxd62J7sJGXDMPerjkYXaDg5HZjB/gH5tHxMAuzjOdVzoz1iq6b\n//Eetihhfy7u/p2ZwHQ2ojUqwa3MPSNWGQoQahWDZd1ZGEYIneJyL7Hqllh6\nvsuV8mclU1PmArypEKW1L4CVdmznyONJqKTq7vuemqJl8yMUlL6x4il+66w8\nolDaTVyeYgjCm48O6YQKN09gVFpAnao37Yywtg2foxc5CM9zaQhbHFh6bVIy\nnyN5ppglu43OhBuQYqutqmXHskR44IEEcgPFA+9ByK8LqN7l3BiNyozNHVTd\nc+1/qaSwDBgs/TdH7uSvg/xiLRMDkZiAw1uiPgTT4joIdJ4fCYJZKpnF903B\neqtFSmhw1+0mubwPpA3MfkXUCZ8BwDRcxjLkj1vlo/Q8RwqqlrjpJXkleDfT\nktgue33wWDOKUGofcdRyv9GM5c6iyEX8GzTxac/fEuivv1SjkYQYSUKG2lCQ\ngFiCl07dMUwk8uKI3HwIA1Q6yI/9/r/T4Ky0K6vqnLy/E0XIYDSGPYsWsqw2\nlF96\r\n=YYex\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICNNTTMUq43EIC93hbBHPEa6RVsYjX6T09coJO/CMK0LAiAri3g7Jkz7htCu8dZvXcngmn2+MLXIcXOS7K9bh2np0A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.15_1572291455255_0.8558935338244567"},"_hasShrinkwrap":false},"0.7.16":{"name":"@react-ssr/nestjs-express","version":"0.7.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.16","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0b25734f16dcd6b18e6a191b8f37b72aff9a866f","_id":"@react-ssr/nestjs-express@0.7.16","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-hfU660R3DOGoW/JjpSiKhJdsx6h6arAC9CrpBjv1XYCdycG00Oao6yFdVdmkyW/3d+wAP5iw97XIM/n7LdIM0g==","shasum":"5fbeb42f66ea12f414a87009733d76722a237d3c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.16.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt0RnCRA9TVsSAnZWagAARk4P/3W+UBy4DodJjCc8D17W\nziChZF3v3XMDoo/l1SwjAet872zdOy3hjISL6MbdIi/+nOzbGypNBmd094XL\nzJx5ENfl958OZkJCqy5U37oigqmhlUAoeQtnm4XDbvrwCrnz/9YX9u9iY40a\npEvrjBTYPScT0KCwC1Wvng/r3ixg6edQWcyXJzkdqL5kM2lxjGv15tGc9VLt\ndUjKsTLFRqJF/PtUz5kRFSr8IeCq/fPD1Mm6dEtpwKnlnNxKvZjmKue3MC/F\n3IEi23ZyjxugmsP7W+mC3/LBxVKH+cZp+uU4dKf3YzC39MB3lMeP8eXtA4ID\n9vlWce1A1LRsav0T7xNnVF6nEBNFZg5QQjlgH69Whnf9oHpD9mVjy4wqgXAP\nfse44nx47fOZpcs3vqMS27ytCY8EX7XNqnj9QGGmbJzF5AM/Sfufk7doj+9e\n+u4MzU5zQGw4KPb9HTMa03/SYy1xCEV9HZUkyPwHHdojlvuka1vCdQregBye\nlj/Yao0OFOJOijapq5ciRgd7x++9/P2ir54LDv5OKKxzjbsu50LYd57L23MP\noAbUEmpep8hu6spU4geYGbSawuPWqmu2J7WlgFgW55N8zfFc7ZJ8W6k3Q8yB\nv73TUUumGFTZvoA4pPgrakyRHLMBZsKdrrQwx5Ce6JBvJCKqn/nwKcFy6WMA\nfr/k\r\n=iJ6w\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICE/hm5Mfb8EgGrOuDkvMqbKawuEv6KQYhLcwudHEFmvAiEAp78xxwRUCrR4IbWiJfS5sjKJSib7uwV2PUz0SoNm2KI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.16_1572291687473_0.716379657051962"},"_hasShrinkwrap":false},"0.7.17":{"name":"@react-ssr/nestjs-express","version":"0.7.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.17","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"79175c22794b32c36a4976aba17c2c90016bbd33","_id":"@react-ssr/nestjs-express@0.7.17","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-sCOSErJLBsOVPNCvg6anyI9JX40Akby1TS3b3Wr9Jcxsa2WUTVVlnURD3fNScp5+66n6YaGDeeqi1U8XjlB5bA==","shasum":"cc72700dede3e4cfaf7cfe54f4990edbd39ed189","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.17.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt0UXCRA9TVsSAnZWagAAZmsP/RThKq/J74QhLXC33aW1\n4SCizOOJXxzyjaSfn1O5sRO2F5Aly278CNcPjIOT4Su0aAm1mw/M4gElVcVN\nP2k3Gga4dPUmwXF3en+Q9SRyh+QSn8AyycClaL8YcjLpdvQyKiPf0uQUqILb\n1INMRhg3oYpM7NMWhU1IumGzXrv2Z0ftiS+KyqPTHkSLGXLVTrlStsqoCVCR\nBWi3xOpJaS6FY8R6gEIGqY8ce0vLUABuGY4iyaeyBjJM+m7WmgcnCrd2AmNV\n0fcA/8p33xlBZSji0zdY2iYBsrVtnEIXD6WfQIAq+zFoloAfKrVhakosQu3p\njBBaz/Jw+bR1+tPB9BcBUpH1u3cLNcnpNEyh2RYyRDbVu3sKbcRnEU8cBwY/\nHOavtUU+wHf2CGSgoJ7jVjxDnSXV9p6QMvJZDi00xVqEld/jJxcLeaWhEO3U\nJuIJfTbjGvRZW5MIY7Jvkrq4mEYGum8AxRgLlsY2mxcRvO1wnqVGleokJZnZ\n6Lg1XDYUerdh8ggLu2mMmX1rBy1GkD7gnCQew4MYFpOj+MpzyKVK0RgREMwK\nUAT5FGY0P51yX3NLWW5+12qc6R1cobpiqgBKCqC33d30fR3CUgmiLGCL12lS\nRuporGURgrm4TugdmiGd+XW3GxoguVpvqiAaNaQ4/VtBZx+po+JENEOgBFiO\nx1se\r\n=1zg+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID8sNB8bdNDyPSP1WrB1Ga65zg59MQt2JdB108xEFAyxAiEAosYAgzWvdxCYcZEgJM/fOT1AaP6JuWsAnkql1ocKR2s="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.17_1572291862555_0.12016641725965149"},"_hasShrinkwrap":false},"0.7.18":{"name":"@react-ssr/nestjs-express","version":"0.7.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.18","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8849f840917731710492bac3d432f08cd2b9f1c1","_id":"@react-ssr/nestjs-express@0.7.18","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-C8S1S7fOpDfXCDA5W0kTDoZH3/wnjM5pHtXvANVIyyE44KF9MvTOKlwQ8uKVWxDeE7Q6zILy4047wH96aaJnig==","shasum":"e2f27cd9b2a687441f03d8ba1be3ae47a002b25e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.18.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt0sACRA9TVsSAnZWagAAKx8P/A7LH99NvvecVVjfgVcj\nFWFtrGznDlTjE1HU6ueyseHtv8Q8apKjt3c/DFvIVk+VlCjcuUcf8j/FLHvT\no+ojHFD9mA1hj1xukYiHDNoQbRAc5x3Lm4yIobJ/xkuUNLy9ckKU11fnXD38\nd3rG//Cz/CaMBbvKIHE8668yxv2xyADWMm/pyKrMarLEwe5OLZKO/eoZcyES\nr76n+PfxKZdvWwsQQIAea8MFlEQ4fDWOe+UC7NzBZ9XlifBw2gYg9dMYjjOn\n0F5gcte1oC0KNOTRT0o2YAe7jaVRs9Ep1Dtvd9Ge5HrfSj+SZxlLwYDyxbaq\nEYOKwu10RDTdgF7Vpv+txAFgSvAoEKCF6UOqy0SP6HLpOSkiOWOOqck3hSfK\ngA+vHBTXtpi+2l8zwrqmJcQtadzIQdVk52lsOvLTlttUFuAdishgoyUoNi7P\nXTfWlCqnrWt0Or4H/pDGOjr2tVIOkBAsUBpC+KggaoMCPHB3tzWSRMKPMrA3\na6vv20hRNVooRYsV8z7X2wlrUpvZuD3GxHL50BH2Ax3MndibVbYbV1wvUA6g\nYd3FgTkp7N+QWS+rXzYyfbABs6VH3V/XswtI61G/emT02A8/kOV36hCQgZrG\nywJXztGZdFBmKiTY747eEFAoVHgXfBqXBcOSpq/R+6oXJXMx8Fd/c9VwojxI\nKLsl\r\n=DTWf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCwZn6LQTYDOo7yo8wl8n1P38h91ZcFn22KSL7+5n7wpwIgIU33kSXRVwDSNmPgDEl8NuacDebyYqt8AoBlzMZatI0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.18_1572293376323_0.9781114643331925"},"_hasShrinkwrap":false},"0.7.19":{"name":"@react-ssr/nestjs-express","version":"0.7.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.19","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"26071ac4000fc9870b97eebedd32c79f8ee5062c","_id":"@react-ssr/nestjs-express@0.7.19","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-OKyCN4VYSa/jqjzBn29vIa0XFG4O8czNU5dghUA1iNvtllbE3OA1jAGBF8Prv2WIlsv7PZkT1as1+2qqHd+2YA==","shasum":"670d9741d0821289e65ff19ea8be7c47529831d2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.19.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt0vRCRA9TVsSAnZWagAAtMgP/jSCPABvhSQfHF4rqUlH\ncuV4ssVtv8WNxkwGvsMWuI6dOYYDbBQ8EsRhQ65MfLal5Y+IyFOAMWcCSDia\nsDt6o7qH2I0BaK568ftUHjy1xYd4dwmo1wEwMRinRj3Iu867Az/Tg6TC4dIw\nIUaKWt0sCkS1kOVv6BQ3CLH2DPmUWtySEEaSrgVs1Jem+yYSWdcZP/hjlbWI\ntiKJhYK92S27Sw8QHvmODMlBS98fBh0Ad0R8Id3CQ1UCYsSWG8uPVcx9Bcgy\npud84VxoUaClUzfPNCGA0kn28kCnPOOrwHg3UaPLRSv/HxqzzG4mZHVGYlAY\n2kaR4SBf6/0Go/GYXq7GFHcganXZdKdDELxsFgzN/Lvw/jJBM9dZvWV5JyHH\ncYyRBen2RIDRyvob65kLgDHHonINgASQrv+iOYJ4tsRwd4z3jmUBiwYlYW7C\nUjivdKxPJupOv/rd+THzki0t3wgUvKkIUmxUy+icv3Z//f6bB+PkvRfHARHn\neMXvBWCg2VRK3PH1PxkjKR8Kop/wJdFObmT7FjmTjjd0XUU8VJqqL6cXqs4X\n42aZ+NdbPe//qYsMojE/hv9k69Sf5ZZcjYcKP5KID9Y+qgogfH1nm2QHUbsA\nX5DDDll2CNhr9hFKR/A+Su+00/LjgVMNCu/lSgeFtnLLQSJGHigU8/ppPoHb\npo+M\r\n=ngiu\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC6epjakGxb9akYiuo0bKxSsnZPftj89KznghW3VA9jtgIhAIVTU7Mg1fXlV2Zt8UeE4r8SDXGgUJgY4dfvsLN57Yme"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.19_1572293585008_0.8433774955057689"},"_hasShrinkwrap":false},"0.7.20":{"name":"@react-ssr/nestjs-express","version":"0.7.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.20","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"44b98234dc2445c5a7f87302eb86219964b5e546","_id":"@react-ssr/nestjs-express@0.7.20","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-BqwA3fhTx6dauxNRMayAOsCWHHbRcgtMfMp1rdBs1W89Tod5aajNBQhfqE+dD95GzIiu513s/xL7w/fftveSzA==","shasum":"e02d955140d29225d3160837079daff2debab9e7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.20.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt0ylCRA9TVsSAnZWagAAjvcP/A0vg6Pr17AIhDdj8Di+\nFGm3GOlu7J4OvtQHXnGGFYGG9NpiSP9hbxoozWfj/+USW5MFeJY9B0CaRLKP\nHKGgsCPuNAgXjLJnwvVkZ5bbIgpOJrB6uV3qkl9Gzm8o5Deb9D3O3WcWoiQI\nrILIbB0PejYaZ2fck/CWuFyH9uoy38g5I44sNM6EAa9XV6Z0/mz4dxZ49gGp\nmW25X/SMauMb1NW1LLKHVC0kf65+bwbFf0aArdxOAt9ptPnUdyTTmVkiaHDV\nwiau0DUjN6Rk05vlVG6hs8b2GSLTh3QHrMvdPFoBBrttYG7bnf185qsMEd5Z\ntHz3JiON1JbYSEOAGDBJKQ9gLPAFFGXym7/DilBZDS/rM1Z6e9dN12HmrMmS\nzRhQm9KxAvpYBGosXIFT3yRsVxL5sMQ97mTTjtT3UpTFqYY8wWoOELkGYjNo\nmSPNlsDPwTFpFCDtqeNqccWb2IUepuqKBUJhBhtELdHmhka6KmWwq47GqxJc\nza18TXGmQ38S5GpoLZ4M7jTqYT6en3iXzxE8/q1Q5RuRvJQbFeBECnsf3r4V\npUhAaRvy9P1xLWmCLHw4uWXnAQzwcOOgy5CNqXfKOuAHLw6uB+pzcD/swGgZ\nmqvsZBFm9bqq20Z5nEBMeUyRBHWHsl1aLJr861755P0u3QqxTT1t68N3GuPV\ny9AO\r\n=/aqW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFqaZ9KIvPbQ1pK4cxjV7u8o/Wvsu2pvJVhIhyEwuMBgAiEAtpVe0CylsSvHTcc4Wq3XBgnDqrY/JuSv99j1cx12n+o="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.20_1572293796923_0.27870182464716997"},"_hasShrinkwrap":false},"0.7.21":{"name":"@react-ssr/nestjs-express","version":"0.7.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.21","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"16f78c034d72b6d9e3264ccfe8a302feed57e673","_id":"@react-ssr/nestjs-express@0.7.21","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-yErQKpRQyvY4ogwOKDtQikgdTHw43nsZxv+pUSDqy4nwQ+IZdsnUhepP3NSpDVHmSnlNO9aDRMrcVlmZ0ml7tQ==","shasum":"e784691846a69b1e1d99c3ab11a02d79352a1a68","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.21.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt00XCRA9TVsSAnZWagAAJj0P/1GOO8aUQI6YJdiB7yqM\nGDltLEXdN88kj4FuxQ2PIidBwnzbj/u+EklDllcddV1s6QmEjdc7d0MNmgve\n6qTjVoMJMV0/tzPtZUK4BtuzQ8ic/naIr7HBui5naJ4xHeA70gn76e1ci881\nllmA/SACYP8UZqh8Y/naUpVPzLd3j1gVXVP//104KZOutAn5WB3N6E9Z49FU\n+TNwMsuYwjSKlDwhowVpthflzH+vkLjEO7ZKnl6pnuKkJh/B4/eFW12lFEX3\nmXRF0shoCBflMOdT8ofAeVH67rB+Rc4Wc0gscFPRZ6vWdAb7vM1GGLzaPWp6\nlQVwXYD1dhtWIqkDo83K87fv8v2ffMljSG8At8toRECJE+qfLjr89lq2DY0G\nl+wR+Q8XLDYGBxCgCAQgAFCr1HKSkN+A5Y7wwVgLijG1As7vvIld8d3bNywB\ndIrI3Hj0RgFFirVesKDm7JoQJmRoy4O148w8BAL0C09di6gihsqJs937Aidq\nUOHMD813hBkkWNpfyBhTpnllt9GEy7rdivHPdjTMDsqZDYQs/0yRf5gAk+HK\nFA7dniJUrtj1/Z1y5itdHctMbtdajTd92jUy2uKf6MVJ2E9a2W8pni8IIgrw\nCFiyL51VXKqbR0YW/QefWhFBqPX5CAzuRfiFPKK+GCSEf3uPHjWC+ft/gW63\nq7Nl\r\n=G5Ac\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDYFxic0wu2R7lCuRkT/oPJ86p8UO2zkobXK933jTJttwIhANxWTngx1VZSMImYjyk2blBACS6yalI7yjWeOx+Ekksi"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.21_1572293910630_0.9589452168584582"},"_hasShrinkwrap":false},"0.7.22":{"name":"@react-ssr/nestjs-express","version":"0.7.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.22","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5f4a4d1cf10bcdd0c52c04682682e35762d2a5c8","_id":"@react-ssr/nestjs-express@0.7.22","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-77KmUY4xEGYQuZUi2EZC8zvncAk3olrbkA0I2UQIEpW+WlJHGUPr0G2cv07dXi+F78sAYX+k2urbsncAXZiGXg==","shasum":"a6d8e4a364a4c1246a94a8e66026e2dc925995ab","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.22.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt0/pCRA9TVsSAnZWagAApfkP/1ieUuDj9uHu5SJPxMhj\n5SbE/vvV9B0ZzHfukOsoP/69i0Jw8Be5Dv/pI4B84dcISwKZ1z/BmNJJhRm6\nvzh+rp7scb3PblMdTPVNfKDn14+cNAPpbbkbIOAdb2um1ToQNRWIqUUl7wjk\nkW/0lJzVm8RsUpBbMiCAAtms4YGCveZplvHX7XyRoW1lnHoYA6JKFbgJoXwl\n5e04my99U1MBk42Caf8CgIMpnttcQpLaiw8RpzvpsOGLCpk57PjyHj0oeim3\nzfgh1Y4AIIXhLJ375ThFEzM0bUQOEQzud1HA3eBW+2uz88GdY6lZvCWkdQTB\ni0oZTf0rPSf0fT7PdLepTF/6lH46mHQtO+Pusx7k/Qyjs6FZqdM55GaYCCwl\nsNhc3YXRCNKf1OTsJ8llIIYJTOZkSgHgKY6AeFM6QjwQ6i6W9jaUYbD/9yei\nmsBq9g4HPc01m7DjjP/ENso6te9LSoHAWVK3sJx9hINzJg6B5AABXLeqvwkC\n/yyb5kdcK51sYRv2iSmgPPTqzqrLIGoBmlFeQdCp/nmNfcbgELrQdJf7GG8G\nfNZUUuYfCC2r7lKvsuQgFbZHfKNKOdekr6Pd1V1FBMG5Dhl1ZP5xPot+Wwqr\nh6FedfvCiVP0PCty0Z8PFkmAiLqTRX8apIPO3/JiKN699CkKLY85nxPxMsr5\ntPWK\r\n=GQMg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB9+UDk9mi2pfzNDZfOgkOwGZFka2XNq6FbILTiJ0AoGAiEArN73GtfzfTOCOKaqeZ4NktOgtVJN4vg0vuRPK7sat2U="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.22_1572294632700_0.44108312606224387"},"_hasShrinkwrap":false},"0.7.23":{"name":"@react-ssr/nestjs-express","version":"0.7.23","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.23","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f69eac1a0d7977f764fb65c84a229388ff47675e","_id":"@react-ssr/nestjs-express@0.7.23","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-suXgTNDOlFhCyT2SnwXYGshSEqyGH1+1IjJf01Q5gNjCe93TmRx6T5HVuo6qrjLqYQdqETQMjKtgCMZK0BN/Cg==","shasum":"568097d3cb1a632fc8dd583d336408db3507ab27","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.23.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1EvCRA9TVsSAnZWagAA+fMQAKJp9yYgBeEdYpL2X5bp\n81Ho39q4lzQprJPzDv9jCFglXXFki90ESu47zV73MbJzxkJaoOvXwLzgoJOK\nR2qjVOZR06VSxlySF0epk/2PXzI+nOnEbyDlbeE/gmXkq8Z9ITQd7FGl/ois\nTBTSrTf8si+Jf6FRWoiIN4AAYd6itRYiVzMr85eK51yRo9lyle0NKmR+HKiT\nemC0/hXMABc/z+1z4/oJwYkboZcokPFOe8sLcMGYHOusTJd6R8TO4j7qU/CF\nnIzA8Wp+XljbFvO9qz/TyUDa3SmUTcPtpyOGAn1Fw7mnR3LBHHL9JVQMIf5q\n5+OV7ZXIeRk+vQ+YPzB42dIGoN+lYzH8pgKDNGG9KlaNIYsO6gGyemwcdfu7\nLVOObXy0dqc+LSxCs+SWjw9xEBpWTTMErMNIeMlfYfRDxRJ9OPmkJWV3ZgZ6\nLDfMjCuOp1Hgn6AUs5OjvySjPURvzwG8LoQPxupkrljIZuNnN+YX8GDkgBR0\nAgJAUYtMK+cv6ihgSQNGkaUtmHHXdeg61G8z0wcK3I5fWv3VShxiQMec9r1I\nl+AnzLVHrIPTyKAP9Zt5FhM4Or9g+tPnMIKWgdXcx13jyuBIhJqW6ebgo8Bi\n6roGJP8+7xzPJO62QsrOothtn4egyENwlg4+TgkOOQl6obQJXgAKc9okyviC\nO3Vm\r\n=Y+jl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCtcdmpvYZntFhXINNgDOGuRVkpXNKiuXZmvLJoJUEuWgIhAOPWDS6pqB4xrA43i+W8cm//VbsgXBxwS6AdP57QN8tT"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.23_1572294959286_0.4844850856758556"},"_hasShrinkwrap":false},"0.7.24":{"name":"@react-ssr/nestjs-express","version":"0.7.24","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.24","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b33f0eb36dc9087fbc8167460fab1b449049a8ef","_id":"@react-ssr/nestjs-express@0.7.24","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-uZo0wvZXBzUEFaLk3jbIj0nYFfdnkYMrhf2Ei9D8KukS56j+KwPhomOhXgqRPbkDRQmG5QEpa9bjhoQIpjRiSg==","shasum":"301ae3db5121b8676474016b4e7eba6a70c24eb3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.24.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1IBCRA9TVsSAnZWagAAmM8P/1WBNinOB6AmgDu9rCo9\nObT85YjGYgqySJKAJ67mF6dlFNESDgNzJ9G4OAK532qZK4MnFN963syJVcnh\nB4svtQ9OyYoyjqpVwE1rkncaCn1MiA2+rRtT+v6A+FtU1tiTMXYpPVCZTenq\nVgYpVmO/fLWwRGKSw1gA5iXk9PY6Q2/oU5HfzkqaRqG5TwkhTYBRBGUXidpF\nb8+AbS5x0XZMsqZQnV2t5MA2D0pb83dtio4h5BRAWem6ac3J9IebDKGJ4Zk2\n28nOOG6X0kXLuUmbcv+IcrsTMchbOJVbUua9Cs5vv4vKTyEN7LgXatnJfICU\nAp5u4w4fQOWrXIUhdYWm6f/Vi9kO4Bk1tdP8TkFmo8osLiCWWvwvkN+C+3Yc\nVcjITE+F1P7+92u4VOBAjTAtz7fi+p0FRjVZzNOlQERUqSmoTRnY0hgOl0yb\nohpxiGkUI+CxZl9ufqdPIZ2j4TYN0AVL7nKjrop4AB7KPXoRugMn20+z8mjD\nH4bWwX+PaJwX5zeIjp7vv1JjK3rcEhrborfnNN5W80tXzGEp9yQLX6d9pKNP\nWcTdHaeBuYnsYGrzOAUueK/EQ+Be9zp+srCb+SOKbeL5oYYrCQBoVYf9KSO0\npdwb/0VO/8FX98vEeCQLJRokxRZbxkl50U8n8XaR5GxHYbmcegRVnDKlXKIE\n88hL\r\n=NVmu\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDq34DrP8cd32sWc5sK2r6DDYfs/QWlO76Q4NiOrjj77AIhAKkD7Vtuy6vD5/370LpN0960aTZHCTugZEH3LcjyRidH"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.24_1572295169144_0.973926574640607"},"_hasShrinkwrap":false},"0.7.25":{"name":"@react-ssr/nestjs-express","version":"0.7.25","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.25","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ace0d3cdab0e6224baea8534b751b04da13e92f1","_id":"@react-ssr/nestjs-express@0.7.25","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2X04TXmIYVyxNt7sf9BrBVVI016zRg8ViLUSGwYxWZ/yXUfG+9o4mD/4NQFTAz7UnKBDWQ8RUDnwEHng1xaWhg==","shasum":"1daa5e4eb1eccbc04df653e69bc2c106285d21e6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.25.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1SiCRA9TVsSAnZWagAAbK8P/iYElLuxXP2bSgIXnycF\nufRrIxEU89xVLOuMr0QP0zeISxJLKN7Mry+QEeGuGhYvcnETa0ss0+16hKq2\nqy0gWuOXgIrUjjmFI92H71YMYrHw8Md0OGL1yn1nSubfDi4h8djDONvHcVzF\npXfKvNMZsAz0OTHcTPpoHfC5RTbRRKZZoSeAsfZcJGk+bU2dt1b+yEA0sW5/\nLwldQ55SvTDQTedi6TLJMoxc76Z4m4zT8BbYrg2F+QGEqs0TB+EWcYZ8aCLy\nn8DTFxrQeP7eTOfTpJ4fO7hOz/rdot1cDzynilYB+DTYt4EEglnsK6ctB3JG\nyoS9zwxG+XLDf3MCG7ab5qvJt0SJT00XV53CzP5lwCwnafwsfmEIgRfWjWTm\nUicl3lNuzt2HPF+/C4MTIUBnn9MesdtHkB9eHWTksLCBKdkRn1Fzrp4LrCWG\ndKzpeC29mCr+MvS+IqQtBq9L8xlzznMFJlrZ2xC4QlaRVlknN5OI+moif2bT\nEMnQICj3DSac4y4tjCaLoPUBM8M0iTT5EdZpAgLeJuG6QQq+7GoH38PnLZt9\n8LBlnDDxOQqLZDzTT9Uxh91zcQvvVjiW7rvL3/GUGHzGkxESiO9L/CwiTGPI\nEWFNXXreyc9f5f4n4H0/clOlhXA+0NNgEZrIFFEhKEd/9RRtexor58JYXoDa\noxmW\r\n=h1v9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF45o7bHg2AJIVisBPhDc8gizSFuuCw+KgmaeIyzJcjkAiEAq5Fecne/mbepHUSjhD6YYs4fJAy81XfIFzZOGVllKZw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.25_1572295842254_0.3252454875450439"},"_hasShrinkwrap":false},"0.7.26":{"name":"@react-ssr/nestjs-express","version":"0.7.26","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.26","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"081e6674d650d67ba36ffa10a5f691acd1d74be3","_id":"@react-ssr/nestjs-express@0.7.26","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-d0gcfdN3tlcJ/tYvEYw3tvnse3ijkZHYAS68uotiRLuk2GbkM5/gRQflQUUJuPTdvB8Ymwqqxkxq5Vqf/RzcNw==","shasum":"84830039609a5724c3b4745226c3940aa8b906ee","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.26.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1XtCRA9TVsSAnZWagAAYWoP/A6lCborUJ2K94CyfOKU\nrj01BQgR6N9m9vpQg6KYShKg/2Tdl+IdgkAqNnJKCYlIR9rDeOn3a0SjANNF\ntoyy0cC/Gyvsksg8vi429oz6uhnikiiLfuXekvmuQ2sXy0mjjfjUS3WmFatX\n70RMNgVBp4Fm8jQvEzjoVAiUdsD3+YlGnrmflu0/J/fOZTSqft5OQP5mf2Xv\nbzId3bw/pF0v29avNt9zC4QJM71tmFdam76+H8GyTIdONLMlJ/tiNj+nfLdC\nqmXE1fKN9mMuZ03hK+anXTPNj4yvtuziyJJDPfIaBa/gFGIpaj7pCyfciSRh\nc9yoCwzy2f1WPn/9dmJEWPG7GD/Hr8OxYvrNK3Ds8zLT1HA6vg8ChKK8amBP\nWEpXSAqbO3z2xEEe5MsSRFAa2rWQsh0bzfGuCDBa2ZLp7fzCHkmq4ODFJTVQ\nqNa7dZq9y3+y3mMCZi5FdK0/3chRCMhccgPFUAvHhkxFKLeDdiOjKMjSIlAw\nYNuu50AbtAiPqKFqN63s8OgXAh3n3GTznSW64FEu2EdI30gRwOkNj1NkwNsI\n+fnb5X52FuB1kP2p+463aqPjxqfFF62NFnTWARCKFepXw7mOxUl2SYnw7fIW\nA9kTmU++7Wy8suw3Rsd209NgHqC0TapPT2ASppNy1g0Hu5iuhQ4Ba8fVKT3h\nGmVm\r\n=plUz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFf85FH92/d++Ny1K0msODNCcR6QoFMHczOTv4sylxfMAiAJUVLhiy8G/BulWcf9E6btl4auN8/VICPTCJjfbNfkLQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.26_1572296173285_0.08632536132833568"},"_hasShrinkwrap":false},"0.7.27":{"name":"@react-ssr/nestjs-express","version":"0.7.27","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.27","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f38972bb642e0bcfe3be5836a5b26919b0087c38","_id":"@react-ssr/nestjs-express@0.7.27","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ekQbiTTxYImtigt5z+mUiwdnfbPKdDVFwTO3ow4a6kvgZZe7M9cukc7hl/0EI1+6jhiWpnKi8QkiSGnnajFp3A==","shasum":"42caa303fc2aeef8f0e3dc8d99dd72d0b6872a14","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.27.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1bFCRA9TVsSAnZWagAAhPMP/iHvVyT9xw0KTf3zf3Pz\nnH0PKrnyib41yNxv/zSxLmMdzKRKpg40eJheg9MgwGPm4gguH/xcLsBTKeub\nw/phA4Kj6CymImSvsypIdBips0UlWQFDe5OiyuVz/PQ2oBgQc4D0r7aCxHSz\nJxmOOQhxRVV45LEYW81vGn1++9LM2aiUH9N5/2qCez1+hlFCXdLWb0sbKq9/\nbZwfvxhRGUED1iRksRiHPq+RJ5vhCmBjkBsTqJ5akyCI03zyshI9GB82XzoM\nGAuKYpkkWPtnHP3PmWVyEXKU/g0UfW3/xE4yaWql7jGqwjwUcdyBqoobsrel\n70k35W4LaV2tAmbj3NLMlZYIccVWUsGwg33Oi6FIQ3dlN0F6p0MtnY2i0V0y\nZWHGoK4uqtBJkt1G3Dg+lD9ZSH/qB8emQ8wqOEKTTHBVK7Ge5lHf8HQqgGgg\neBxy1bfIAzk0kokok2l4cnH7Jfd0CSf/FlEmMy/aG7I/lddmOi1WXEtoixgM\nBE4yCwoBFYouBwwTiqRVACshxc/vkFAsA4K8bfzzlZ9N7N3vwkWl8zKu+dCK\nx3dX72iH0NBz+/c/zM7KHq1/PZKjgbbgpfxT7xey+Rm/aLUXBGsxOd0N21Na\nnrj74mGuskcWkJRzFsp0sAUxVn0ca3+okVYNSJQ4cMDrs5SE1DVBUUtBSyKs\nPNH8\r\n=rJOW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIE7xa/zzgIwC5j/ncsBSuB5DArqq7UDVVKzn8jDe86RGAiEA1q01MhjZVYDlA9RWdIvQmuYW1IZsdk5IrDjjVzF0zjA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.27_1572296389182_0.28172556584107933"},"_hasShrinkwrap":false},"0.7.28":{"name":"@react-ssr/nestjs-express","version":"0.7.28","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.28","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"720ad62b413b52aa365b0f22455a9a52942bea36","_id":"@react-ssr/nestjs-express@0.7.28","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-MCUnY1z6JgU4OoWDZ5sXljtyTPSWij4RL/Fr3Ffz3e4CTgycwvsePN7INIPdgf45PnkLwUutvtTwKNta1Eko2w==","shasum":"f1ccba3b083169995d2c827c4a63a8d2d06f744f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.28.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1lICRA9TVsSAnZWagAA1hIP/1Z5joUgZTyKRTbitkXR\n0XcUYyNvWsSuC3RoMLKrHA874rhub7CfUadol+nC1KckQXA26ZUHfjhheSsA\nlSstkv1R7Op9dpEqptyfGBXTQ8CJxMjF0yH4I+5U7Ildf5ctGGG82x/+liWF\nUq0Y9hvJ+rSL8250OFORwqekgOeyU3SfgP27DW4X/XPL+64370ZUpy5FAqyO\nbac8aeiflzsthsa0MO3rMIwv2UtCzdaebzaE/EufnsBgpcBTRBF/4u6WV9h7\n2nKVn4mN9Jvt6ZAuYn5XfGCVwcoceco0/bxTory2CqCB9YsZddONduVEt3cf\nN6kSy/plgw6TPp8o+h5y1sX6mPpRGAKixu7GKd9rB4Ks2+XRqQYlHLmWQEXr\n2/ERxvZQGP9zdKhNfhr4xekiRWqGL6xbTKLtSTinT299g980mi1hXq35tJOs\nhSgjM2AeV2RQZlOsoqIBkpvLNMkMAcQsDqnSTByfd/Rvhgb7Cf232J8++egZ\nIhZThXbL6Jv5/9nMDS7OLz8+p0P5lXhg3MHnTb9xzcrPwpv/Y1SLVOVX5IUN\nf5TU+HKnFfn1p9EhmFAYXYsbLtPU+Cy5flJ4Uy1ET58GYS+BlIzwzfOdsMSi\nUk62zz3yZ0BRcSu+iyDYkAWL6Fe4AZgn6dcPdJTFzARPRrxqbFMorcqLfOge\nEARd\r\n=Bisj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCP5715NhCMp1YC2vlXtLIGgBHe/YSZHRm9vvCJr//EfwIhALNmPHgJvnUZEClaZ+Xed1UzgA84ambARs2+MUJTUvVV"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.28_1572297031542_0.28285042891309486"},"_hasShrinkwrap":false},"0.7.29":{"name":"@react-ssr/nestjs-express","version":"0.7.29","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.29","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"37684feff02f3d564549db41f65198256f055826","_id":"@react-ssr/nestjs-express@0.7.29","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GW5F1qtVNiNDL9iK3tn5S9ZyJzRHW6RBy18ZVO/cOc9Jqtxc0Iin31QUB07MutO0nseHV/JSryZPqfUFKJVvcw==","shasum":"a7b4bcad2b67d470df74c8e98a2ad778374760a7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.29.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1n2CRA9TVsSAnZWagAAK8MP/1E9aUvzcIKLTcz300ep\ncXYZ4sXFZdtwERipU1tluyc9NddplbUnlD0lQVYb2WpLKrm5DJeGEvixoiRI\nPpwLksUWFFAfx7yzO4AaWHFRsmyO+/F1UfSS0u4MeZZJtT4K7V/b8iPKuvK3\npSQ3wAV77kFrEMIAFmiCvAJiQXIQHFMJj8KHmIo7ZkWRswq3DozARaQfKEpm\nPIibS5EyoeXR7R4qqbe1zIT0cO3qfw18bBcfeqaJySFC2ulw9xnkCRHYwL+B\nLaXbVkm0M13WbBA/L8lRZO3UalenxK5AaGBjbGPPWB8tS7KSnrUR+yhIgDpB\nkMh4VKrX97ZbG8eKE2ygBsrs3cwkZ+ElczTC6B9HD0tqMM0PeAekqviu8Uji\npNZC4H/qQGwcsIvGxuOD+N9/InRE65qFC1YvUyoMYOcQBFkK48SybYrh3OD1\nOlOLZrfPUDaKQpk1HoTniMdhZFwyT70KudiM0uO4AW4viysLTJoli6ijiG0Z\n4ecwLamLMtGuIh0qsNBeGJIvI9d3LewwQdYfMcWswmFsRCvZRZ0BwGF1KQHO\nOlPDuQg7BfhJdBYR+87KwT98RYfgRaTYcD6L6jZhFDxQV4bwR0fSV98dLDhT\nBPDdIzbvTuj+gYZGbGV2nqIVg9rn621q/as4Pq1ygrkJNTNS2KYbqTrguiGO\nTT+C\r\n=VlWN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD5QH9VW1CETPB7u2gtfBdSkKwDWYSgNSGT8tTvSnbOVQIhAKdtP+Dw/f3J4W8A9Lqs5jM+55bGMMS/r1VZa7RAcx31"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.29_1572297205538_0.6607977371227385"},"_hasShrinkwrap":false},"0.7.30":{"name":"@react-ssr/nestjs-express","version":"0.7.30","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.30","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"71f4ed0388d6b737809c57d965471971dcc20708","_id":"@react-ssr/nestjs-express@0.7.30","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-buurmSqRCNGChWD5j6fhETLTGom5vbS9O786NM+qD/+MiSZdkR2M/5WlIZHZz70V4rvnFO91S1KbwfF2jEWAPg==","shasum":"a311403dd88bd2467984194b6f024acb1634d309","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.30.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1rjCRA9TVsSAnZWagAA1k8P/0XSaBoQ8mBf8rsrtocV\nyFIM+MiiavPZZY6hSAJsN61HfiP5cmKGDFgK07DoZMZutNEFe3N9VuryKMFc\n3Jj9czblWEXcUtwJYPrYP4YwDY/X7gcWbYsdBMtET36iP5JvSf1fEJLOLa8u\nUqK2snQxW3crVZR3lvt33vZAURWINsw4+z9aB817YHdqxs3uS1Utn6RUNplV\nStESnzPCIC6v3Hz60hpWiIjCNLT0hFcIL4tFppK2RpOPMI0EpnAunHDKx0Q8\nJm4Sj9EJygb8Yoyz8SqNWBWkcGnUrnVZJ8ov7hEhPJaXvdgdZab+H79iqUc+\navVdBg2zaBFxcu+xHaFLzdYpYuPak97s+2QZp6LVRw0GZZL+ez5EGQYvumtp\nrDfjh1oCn3Uxcn3PqpPfbPk+QsvgbMTnd5ycYrB3J3JL2b8i1JYSy3j9LUc1\nTDKYdj1QaDvjLOEoZ/mqcHbEFRSmDXnIZsdhRn7GkehqWNVI78QZAjNyJ6jd\nY1q0a3pa+MZV061GJ65d9YR0rlB6WgaiF82k/YsWJC51NwmwAmPoH18QCuTB\nA4zMgIl+ODsp3LRlbU9BDDEMi8+2CePLlhP5uE/duiW4L5/DaQLa2MOJkHTW\n2iy/tu6fIcpBNv1MLjdxyzGJXpqknfNmIabn2NiiAu4FY2qRvqyzMlB+gxz0\nADSQ\r\n=VJNV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCSDIZrVfeFGbWn4QfMp/eXFxBkjsQg0UY3op2DxcJ3KgIgcMYw/pNwKDlv1/3Gj0oGgPDn8ZlhDSaGGUC8kvtnzmI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.30_1572297442961_0.4008814679360517"},"_hasShrinkwrap":false},"0.7.31":{"name":"@react-ssr/nestjs-express","version":"0.7.31","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.31","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"da8482fa649e367d03b1a5a78933773b0e2dc8e3","_id":"@react-ssr/nestjs-express@0.7.31","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bwPLzTe/EwZfU/Q6TQQxTF/ooKoScV/w15DZTaB3J1kh3DqBlIPpKy37c8Gdw5mpGiH5Cd44vMbcI6MQumJxkQ==","shasum":"665b4b8b7013b3b8b1a3f9976d296ac97cc9906e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.31.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1yJCRA9TVsSAnZWagAAi+cP/3XN6TBlDcGViv7TxjtH\n9v+oCM3bjwtvfGk0TDEorQ0oU5dx9FDtCrGm3sk+99oAhBZFnd3/Xl4uufBy\nkVp1493Fn6xJlVe4T2YluES9fLsbMhyFdDRMY5Z2tXRcLO8cOaVKx0Sa+Qg7\nHJDkgEn06gp+QMuhKEKYK5i/EUWEOugjJXzXCV7VvrWYNbO1lnu7VoWsy3uP\nad/Tf/KZlEXdj6hsZWDbWzr0vyn4qGM745vCI68sd1duXB2VTUk4Qp1OlgMo\nNV5mhB8a6KXqDqg3YptwunLjnru81bw+XpUhy1UMyiFRBXhSynRULoWCEVz7\nLmXz/2xdHaQBz8pyO1u+EFatStcTH5sUWhGJhTsE67+lNngbhc9SSIlPSH3g\nkEDmj6sVI2yfFUVo5/DcYdCUSbke1KrGQ+KVCZlObAfp3QIAxX74dGT3HwJl\nPyl8Puws4aiMqOD6XvDr6T88GwknCBrO+wl1OxmtFpf30Lji4YKy8vtoGpRS\nM2nQ2dAAGON1cjtTKtpL+txdRKeBMG0ybKhnRcaIu20Foo9zEfbvAa0SrzdH\n9nvTAjpftfJsamo6s9mV0JtESRBelGiiiMmeb1LjVmBdVmNaW0KSu6F90qb4\nnn9VTPty19s0uallLKRe+97+DZ2gEq1gdOY/JduIH9zciSBnjUTMJGDdJz+k\nue8c\r\n=/mKR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCTBNcimh3yqhqviFeJnwLXkBbbaeoMNaONzT26Qd6/KAIhAPysk5+V8yzRvvXTt5zNn4yWbMblajvk69ZFYE6cT36K"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.31_1572297865285_0.4743099284801575"},"_hasShrinkwrap":false},"0.7.32":{"name":"@react-ssr/nestjs-express","version":"0.7.32","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.32","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"34e13e4cfb84ece1a7d59897b3061bdb1ab30d4f","_id":"@react-ssr/nestjs-express@0.7.32","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Kic3KYysNZiu2oDxovQo1avevAEaYgCJIvVGbNlpXu3P0zDjuo+g259bCBec2zgAHLVt51fNsVWvoyGJbATIOA==","shasum":"0ebbd9177f9b05e42aa10e76793a4a163a628d50","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.32.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt10UCRA9TVsSAnZWagAAo/IP/j46gJ5jW/rONCthJpql\nhbp+R4E3mq3nB0hjzuff/WUAtu5Tv/EJuJils5Fp1gcY1mqLjAAtfTNlyP6+\niVdnGWpvDXNkaAVguh3UOD+UNuZpKSBd7ATeCDmqogbAJx0psHj9P1dljnqV\nGeqaTqqDvtXYkRmilrUgKs3kO68pnVBO6MrcTGkrEkVBp6BS5pak7HPfkUQf\n21Hp2h9qwVMk2w8ZSbTVqkt0zxiLtsBmuKGyXvXOpFPgYt5cn/zvVygktCt7\nAroT0iCYrgC+JTIdNOWGEWMJKpWRQNsrtsOBBGXVNDFVbReN7w/Obx1FYu2C\ni5w/FJ6GGzawuPG/GCQ+l3V7qeFgaW1zxW95acGijvPMDHTQH3rjvGMVlDfY\nuoBvIt7FzFHXoA0DThf2/dMB+R4E/HCFfcYqjTc1p0mrqznVt1aHe6L65NEL\np/he995hH1YChxmDc47ROYztnqJyR1x7xb4PuFXpWaubDkJ1tdh1akLj4heU\nAqCHtnduqTR82/Pu1kAyNJGoquhjGzeHtWZwSfbA3SBh+eZVz0sXqSO0iXbH\nifg5zDJntgak7eXyHccxSwaH5HgyYGlyeQzcRO/eLMm+uCUd3U2Drwlk21ih\nrfOza62b2/Wm2b9JcSIUFbB4eHtqbUtii1fw7AJuzfNoMryjc64WYHQSI2TU\nMHDn\r\n=lZg7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHNSXOvvec0/noZArUf5sxPxxXevrSZcL+dOd3oI8SgXAiAY75KiYOKZNQllhx6oX7pFKPOyypJKObuk5XUMbRkbMg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.32_1572298004183_0.8469206943604926"},"_hasShrinkwrap":false},"0.7.33":{"name":"@react-ssr/nestjs-express","version":"0.7.33","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.33","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"05ed8b6a6f97cbeabd8bd96282ee83efa5046d78","_id":"@react-ssr/nestjs-express@0.7.33","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-UGZxA7cRMoNdEeyLBx6/e7NGLVmVVT88Z/IoqNZGMxobHksVg2PWjsq9YIM0P4tq4q8sIglInq4Ie5T3HiJ4Vg==","shasum":"2d6b0721f1896aebb3122462be9e9767ef373ac2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.33.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt14nCRA9TVsSAnZWagAAr0oP/3lxb2UVy03klkYpqpU0\nYyzQF0EJ15o7xS6hTW0/zmEERasn2oc95WJPj36dpQFbPGICLu3Pjp9ml9qL\nN8zEvMflbNf2pV2bd6wZpaMKEUE2NeMy3W8DIMq3bG/MZrhwKiMBakbWDx3Z\nrOLsIoAwl+7LxSfNtBW2ABTd7tszsoScyh/IXVx36TMt4QM5yjfoGs+t3YnI\nCRgo+8ZAOVIxUhCX/eTz5LLskCq3jMOvvaIg7joolRexJ8DhQ5RGi9GUQv17\nkOO43IqlCJIdi1QQu3tjXz057BTd0Q9re7XQhRDwxLgw5UFgw5snWGqWre4L\nDQ/kvRHeZNeBMe940fggsVtBF3YCtkEmzvDdjQQnrytQqYfxiplAbDzLDFDQ\n9Ub9a/Pjnp6troFiZtuNM5slnmNtC1ins9zin/NZDsNgR6MPLZlorEZ62Jat\nFakwGS35/mLnm2R6byKvt3dSKi5nQrE7v4vU5CRNKV4Lprew/9r2RoVDt62n\nuS+56vG2h/MaaoQT2g8XgF9JzF1OSHmHoVdUcANx3rQusE+mkgk0oO74sHf2\n+tqdOj7nYpJ5yE/BLBq8g+udiowBWtJAX03LVv/cb3rfqidDaT7TPQxIcH6x\nO1tQsvDwOkA1CC4GxeDiJq4eDX0DapRLSYDBSzejBv8f0/x5PZso6Pjmj8p6\nNwsV\r\n=5RYO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCx1HgYXWDR/1vWfPZK5fRs2un/LPdWMpemZPmjVwlRqQIgFSpb+jQzssdQer5iQ+5xkUuv2dINTv3bjKedibxto2A="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.33_1572298278875_0.3093951402371198"},"_hasShrinkwrap":false},"0.7.34":{"name":"@react-ssr/nestjs-express","version":"0.7.34","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.34","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d96aca51627b8d61c093aee09d9a8719912631f3","_id":"@react-ssr/nestjs-express@0.7.34","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ojk+jaRCAdxmd7h5Fw6K6VpciEok42F0ef7nZ6fJqr+M85+YW/vgQ2eWx0mqL9KiIjFpfWCpIiqsNpMVeHBDiQ==","shasum":"4cf16ca1f3d6dcad5cd1dc4cecd3ef799e183942","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.34.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt165CRA9TVsSAnZWagAAgV8QAJAiicNb9k7+g2EFpIOU\nG48fzAN6cELSgbjtowFSP5rswnuef1HjlcozJcR+O9uU7YDdB8/wfQLFLGd6\nhYXiDNVtwXUs8MgM83/wwe3PEuLaz1M7CoHtrozRVHv25xubKliNfSNeCpJA\nhi6l7ztPBifBgh93Zrop7RKLX+3wDsoQjUWXr/Cu8R17cuLnDKlNLXgiME1Q\npeq/dXWCVtyolMYFQUCig677r8RNmzyKbeXtIO7ntdXrl1YY099RrIWeUnSv\nn1nG7DluA7wZ8CcgVXhzk2nwbvihCe71mCNlBMzzgyvQTi1tbnVcsbDPCMq+\nDJZP8JJKE6nGn6q9YKT5hYZwUlfr1KNIp556gsIG3b1zbUONpEAOWeXLhE4q\nkULjLJqNm+h+6Va940SrSypH7tcQNuJAFgOrhNrN/O5c4JRqRFAzKrRzHOB3\nMEr6mZd4FVhmQqx9rDhwuqkk4tlwlPlYtLAM1KqvQIvBvWH8qv14l4uXjF0+\nRqK+rz6zwiqZcWRxzChGoTY2UjzfBuhP9DB+WhV45lICiGObnGQF7Jvf0iZP\nV7fTsQK6riPRu3RDm9u+F4yR5XGZ97t72hFN3OyFzBD3UPGeMN76qCXlJMbd\nyfeqd5w1DK7Z4srUY8hKF1W8yo4xSR50f4d4/duNT+IFEIq5qeH6ZIBVwawc\n/Ojm\r\n=SI4m\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE9q6+zNClgeN5WwDLV0lPV8pegYKWTzAwhwDAPetdJkAiBv82DZIl8S2o6nWBmk51XW+bEZCL8fHOZT8EqHCn2ypg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.34_1572298425423_0.8230418663505688"},"_hasShrinkwrap":false},"0.7.35":{"name":"@react-ssr/nestjs-express","version":"0.7.35","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.35","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"af0070683f351231760f97ab3215047b0b66c57b","_id":"@react-ssr/nestjs-express@0.7.35","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-lq5aB8ZzArn3FDociGp+UEirmFX4dvQkMIvO+IJT0B0FBq/88CD614IcK91qpmNnN3UGzTL8RSMBS9gA6zxSIw==","shasum":"7ced88efb7ab17faa8ee7f5db963dbff2fe45866","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.35.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt19SCRA9TVsSAnZWagAAwDoP/1En9zjoLkuSbvGcTJTV\n49tAfaHYiXKzntqIvttUlBs97YaQP3Jj65G9+Mu4pNZ4m+YE27OyDAtlIl72\neDqDdJYXnFh6rc+v4prvz25m/NaubNTDYMFI3MAKoC9PLuxYL6yv74qqHjrG\n1xtQvz1WElxlndq6r+iGAbvWGi7Q98L4ismoiVQmIEyxuhr+4bPs9n9kUXh9\n2awsOiUaNMY9thjSJaN1YexcIG9ZRm/xLFtMmAUp0Q9IJfbKVj571TirTqS5\nBkSkqm/Dl+/+SA/DSO2YWC0SN9vN8tKYPaPeMRoKR0rA+mpV3lKgdifyvgr8\nSTTaNB7jSgbN6muILNOgXovv+nXiXWMv8CEICNO2xDottnX+u2rHBQhlmjzI\nyTQoE9Op6tjZCGlek2HHcqhrGzNY615wcxYiPXjgO8kNexuAhbQCl7dIzXEj\nS2efEgHo19iGry6Frch8z/kqCn383+AUpuDeQmsW8rT40CJKl0TbImSydiDu\nFLIod3Jli20MxvfXWUNamvPEmGzUw93MCwcgkEBj1B04YH9t/yCnDl0xc6CM\nhYPeG1reJhakU6GIa0HlTJKW3zkVSkMcSHcr+42T8w+hPPkKo+fTYxFKgd5t\nxEX6Z9KAomsXiEGF4/drUzx+08ijlhys2mslKkdhxxxvg1nlMB6fbgU/x3Y7\nEvk5\r\n=//J0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDYVummarpJhL/TZSqAyrKdVM5oou+tt/BwWG2nl8Eh6AiEA28EBAho5Ck7Sq1T7U838M5gH6SNmogc+QP9cKJY3sAE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.35_1572298578465_0.6151912130528507"},"_hasShrinkwrap":false},"0.7.36":{"name":"@react-ssr/nestjs-express","version":"0.7.36","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.36","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"80a93d8ebe9b35eab8560aad033bf1b79abdb0bd","_id":"@react-ssr/nestjs-express@0.7.36","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-BzOQLDrKkxWye/IorrcA0WMiDlyf+mnBm6hpyS/gBZ2BtXpA5UG/aSOgCurmxQPQt7LOV1hdPR36EIka/5rUUQ==","shasum":"cd3504d42499fde2d8fc33c633733b4e213b47aa","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.36.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt1/jCRA9TVsSAnZWagAAB4IP/3Uob+8cmE6SfgIsAS+9\nTe1o93UNOpW5venFc7dGww/24vnIE6H+AzOwNDArPf7J/0jYe0vRu70mb0/W\nC2NIWKEyuRTzJhhcgdEkiNqT+GVz02pIJdM+UsRnNxYwNRAO2YS2TcpMb2ka\nROiiCcaqNgh1an2wmk4xx9O2kI8Sng2Js+HeMTXApDn6jk6L8WHy9Z9Fon3D\nQoiUucVEvv/9IJlstrFC4aI3TicOJjpBD5llUsAHHkxSB9VbrcwMXlDRqRAp\nxf2dclONFQxgOQKCo2JjULbHQXyhp7d8Fr/Tg0pIK4OLctKacPivaGcwMTBJ\nUHJRRHWiVG0PaEZN01+ECcwD/ozQHAWk9dr+4pCiXIta2co7rL3YLUJEDH+U\n+1YZfUbHL81zU25hxPt9vNdXdjx1NqeRLI9/vopORs7uvqbfZGRBIWjapMCq\nkLuFGx+dQsTfhRpR3OhQotBuOV6piz2Jv6oDmPQUH5L4alE8fvqCWvrm+5qF\nHLISmAjZi/JztvZWeEqFZIZ6uCLnl8UVWvoPORYsYp0R/WiqKK2o6VD/Ra/E\nHNgFc8/XdVcH4kO8vbVQKGuAu9xubB8YyZ+XNJMJUOaza8rfWyhfgirPwUUH\nh9JUZCyCueYObPr+w/W4xDBROooBB7kqnE3TByg5MkIRSOgPnzr758QMfldh\noUKQ\r\n=Tzmd\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCRMiVgjLx7K087IEPro4lRWjX6bFEwGKgqRUEDYmWi5QIhAJ9Km3VeIHdzuA3ZI+5+wt4dLT4kz2ZFqCDCR37iuxhm"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.36_1572298722786_0.6604268272579705"},"_hasShrinkwrap":false},"0.7.37":{"name":"@react-ssr/nestjs-express","version":"0.7.37","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.37","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"15612ed4542dbe0da81c725048fa9d6e71120e5c","_id":"@react-ssr/nestjs-express@0.7.37","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-9FfJf1Y2YX6UCoM2xRJZwoNQYgFBvLX4/+c7nTptsis1op2b1nHVznr4miguVQB0gGUi7C2WIZDtnn7hLJRxCw==","shasum":"0befd12a85daea9bc66c5d364cb518d9bbb83bd0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.37.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt2CMCRA9TVsSAnZWagAAzbMP/iPLovfj0JE5fhdAwXUc\nMyMZ/fHTMlKvzS3x25Zs+4l/8qySI5lvXy4OLXA1dvl7O2yl0jEIukz1EVXP\nOcNlTflxYC31UVrxC1IC5Ss7CSLySdhJT7LE7eDDVkhJ7QFsFr/HR19d/YkF\nj5N+fipZ7IDTf1JPbKjunsmik2r7EZ30BO+RYTOe2/jYbCXUcpcLPcadFPZi\nDLAcvvrfWPiIvgLkPN9osNYI3/dHK9+Im9sROJX1HGNS9BpeXWAa4waNLzie\nU3GcGDGbhvjQk6c9vs+P0axyG0P7txEKSluwrBw/NvPNz+NaGTSQJvyyTyEC\nzx/2E1oVPuaa74YBLrlTsdZ587jsSQEIb7lcVibIjfUU1a1+avOMp8yWLHfE\n9hRYGi5BBaz68qkwhZ73DsMjhg9coCt7mcKR+RXWd7b2QZBHefVD/ywq1w7a\nArWvdEI/DrrQiNzU8WABF0+prlPkqxlAhg1UalaGNTMfQ8wzBjt4V3409LEH\nQEepYiTrhEeGQyudjiSDEs0LVXlycJJiMjFvZ5X1N5cakFkH/AUaOuKXAbYO\nMstWYHTVjVxCIcKP93G/ZVPgWzQ5/6+u8gP9rWzjXwzp6zorw9OEsIZhKXOa\nbb65Ct2uJ0fMMtvdz6baIkUmMfejOlHj9b/EPkL4Yfl1NQshE3eG4B1Noqri\nwVOb\r\n=11sJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICw+YD2Q9PWABjzg0jkQLVgzZ55orbUcaj8YXkdV/RoyAiEAlbUBaJJr8oVx5NsGwlb7ZAWzZDEk6fFXKWTHrHulmiQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.37_1572298892579_0.630218026136655"},"_hasShrinkwrap":false},"0.7.38":{"name":"@react-ssr/nestjs-express","version":"0.7.38","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.38","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e8a38501a1c21eaf84053e1de02677f2524334cf","_id":"@react-ssr/nestjs-express@0.7.38","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-3PpMlnr5nbG1OgbyJzm6ySPYPMhYZdDX7K4KID77wivYnj73RjtNliD/Iv0aRtHkG/SJMCdXCzRZZnrNhDxwVA==","shasum":"989e09fd51efe7e015ad4ddd134d422269d4bdf0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.38.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt2FzCRA9TVsSAnZWagAAaocP/0t/6IB4yJe7EyDp9ZMo\nAAnTdeNifRGGVfPHKMHow7HsaQXb5FXYI1IpSItqQGliP1GtcvcdTRfm3XB0\nbk9ErTFuPo0vRCgRKoOroNyGMr6cjP3DMRHzXPM29CCNjnInwayYqhkKcOcm\nrsbkmbjgSHv9lLdD7dwLVtORYIR3MQUCfpWjUo3mIfhjX8p5tqe0mmujVB+4\n6Dd+PnEM9TO4TCcvyfyUM4qB34f2hY9mo1ejeyzhxJ0DIG44Li07ybcPH6/0\nThS3Z8F5GjbwS98ByHDs0jn/SJPFGPaTNiDEHpwvaWvLoEWe5hGurYp0CPkJ\nZ0kExuNOEzx+8A3i9RNCFu4kZGdrl2GlOpjAyf31OMcFUVPH+kNW8XsAchlm\nhkPcigM7dxxmMBVmFTtrDCD5DZKDlJtwHc4k+RQifDv9TVLOSmrOhIDTP3nN\n/elVcgSNeeMLembk2RRKyz7ZTwJgTZGkY/djPb2i7wEOxLpnZo9zB0N+FUaS\nuR67BO1h+rflwB+DwbT8tm6IMnDGmtLmjpYOl+7AWzkn0rk4qjYyyYEUSus+\nRFK5kn5T8RWg8GF/L2VvvxeQeMoYMJ5mUX1gCt86V0Nv87PdnZDpo3GEwj7N\nNn+utBsdO+lfuIBAaOjXk+nMioJ23lQSWzAgqMwpslMTypdAIMjTf7N3Bh6u\nudhL\r\n=abcR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGdELrfTLKhhjNJhHxYufIVnEaaJAuZgzJAElMZVMSyTAiEAqX/GeWCZ2GDYY263vHdZQMQjakDXGSQFQzvAzowWgYY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.38_1572299123290_0.47196008136451284"},"_hasShrinkwrap":false},"0.7.39":{"name":"@react-ssr/nestjs-express","version":"0.7.39","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.39","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4a1d0f9b16e58f3e4d954102a2422d0106874530","_id":"@react-ssr/nestjs-express@0.7.39","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/cfnXpVnmn/ePwwI9sA+p4SMzFbrMgf4laquBYZ/GD0H9PqZ9WKc+xMgzxWoE9gKNbx9y1kozCwFxAiCsrW3cw==","shasum":"d83f2bf7fa3a47c1c9c48a5ddac3dd895ed065e1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.39.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt2MgCRA9TVsSAnZWagAAtm8P/A1eSrhGTocOw0kY7+/J\nScAcO5Ox8cRny0aEe2Pkq8JmSGc+ybu/kU/WLLPNIchaZmUEH6syC3arG7mh\n3q3LVJcdOk2kvrAaIJGtHufUTuVvrE1C/K0+N07vAWivCrLLKMiK97ih0cWU\niaoAOLqPMyHDOOGxBSIO8AtShBdBGe7mx9iq5owIqmGlqrry4N3yQ8YScVrq\nMbmQ8eRQ21y41BJ6ppt2doaFescKd+syK1FQVn8x5YH7+0fgi0C2y3Msic1u\nvb30xaFZEPtzOzskE7s/nuGvwd04wvUJzGtj8JFQLhXSpdZTbA5q9ujEGa6q\nJDnmakKyxaChpv8w0jp8+7/1ZiusrTZofJvh8/qG1Pd3Dq2010th5Jq1OCqJ\nCkTkZrX/onsXq0+BJHaTaaal7H4lZ4AkhaBG7GEc51pxuJUCCgzrmAtY+OAT\noOtsyYmytCyyDgW4fem8qBUe9zgnRf2ScB9Vd+1+g9ZwaZSqL1Zy7DbFxLqs\n8vCQO5eFTx9hE0U1/hfwBekGyNv+dGyQFoQ35SvXOVdVgS2//OAvrhiG9EsZ\nuiDGTKzzU07U+Anl49Iufcum9LVUXkqvA9QiZ9W12U+FVkNQexLyDUlOz1jR\nRQj17bM25Op2DEHdt0wahprbzBkdOFAohmHMxJF6CKWsRpeOVdH48H7qBQ4W\nkbW4\r\n=dWJs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAJ79t+2c2KKqhLlVUJuAviqDs5SejnsizJFzzQIBO4ZAiAc/f/CCommoNy1C+Zmy6b7/7R9hVx6TzD819HaH8E59w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.39_1572299551676_0.22896692236453342"},"_hasShrinkwrap":false},"0.7.40":{"name":"@react-ssr/nestjs-express","version":"0.7.40","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.40","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f3e40244cff7ae1b5bfefbe51b0aa3dfc6203fa0","_id":"@react-ssr/nestjs-express@0.7.40","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bWtokss5BdCuvX4+9zu+KEth5tcPkZVwK5dABLFNs1Ou2XSxXc2sNd7hdBXVHNkRbjsrEZcBmYzmnadcUjFqug==","shasum":"eed70b590eb6376ef4ffd469625ae81fef25cd4d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.40.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt2O9CRA9TVsSAnZWagAAe4oP/1lakNSXk1pbKt/mGc4Z\nynQqXWVUWI1uz2UPig5zei0wwUnN4Kt+eHKefEceTwrvpG+mFrmHPWhPURc+\nAjRNBGzoSbvlaSeiSDGbaiWufQFGvUqb8LHhUsqq1Bx36OtNSmoVkxugV7ZL\n2JQsTTQgaYok7e2eTRCFyg8PsCGL4x5G6zs/P9ePf1of3pQUK2/+SeA7peDj\nV6+7Hf+DiAPZ+lJDfzLLdJvrs2PacIvlnU73zvMx8dAMPtcD65Y98H/7cuBY\nlmrix9IP7WlIjpQisGmBcaUbunVecTbXpPvIlTJtuz6DvVb97nROaJKOkCMS\nlFuyJHWj8C3bcwxbubtlWFqVUWmGzt9vGPZiRmq2BAa5V9h6Lc/PPyQz0XpG\nxNGCPWn5gcRb/mPTxRSSuBaonHoyOzbGju3RkoHXzilLDVRG+km1oaGk+e1R\naHHeZ+FnctQBr2l4R4MFHGnPqpUsroEZAHVY5aqRBBxo1YgJmrGV7JmYBzZt\nXwE8+oeusFO+Edf+w23P7vK3ajjpGIhVnLNmhQEzjQ1QtNadr4txMb2QdmJq\nJ5cUB8zNhPNPjzIDnAh6izoo3iHkFLvi7itQv9PjEBRIqPuCqUA74+RnSmgq\nZ47b/ettZ6FXdomMg+XidhvpBtQLycUItuXyeG17dMSoR7BRZcqvjq1KWnpm\niaWI\r\n=Nmq1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD3VhE02P3VF4co9Ek/aiTzh1SUAnkiUXUXnqs/OHDuwwIgL0F4clCfVOo+Akjt/G0NKs1KbICAkvE4Zj7w2oPXWNo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.40_1572299708879_0.3241701987839414"},"_hasShrinkwrap":false},"0.7.41":{"name":"@react-ssr/nestjs-express","version":"0.7.41","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.41","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6b6e43de78b3e3a1be7f1f57e80038f330c9a64c","_id":"@react-ssr/nestjs-express@0.7.41","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GGuNL8wbu4eUvZhbA5NRmd4JF7YV2oCGQmTbJB3IWWIhyp5kLtj4nWwIiKCJqKM0JBj/+6UVNq24XaOIfwUTFg==","shasum":"170f1b6263c6dee495ff56cbf65321816eed9e75","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.41.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt2mNCRA9TVsSAnZWagAAJ1cP/Ajb2JDyspcEa6dXnedo\nlQye1v1gZQcUIGJGj8PqelDu1B+klHMw54KT/WfhwQHfd17dRHk012hflqMD\ny3rwcxfhwFHaTRTR9MlCAxAtMJB98GLSeF0Z2OUXnle3e7uWO5fHin4NtsIA\nrR47RUmIZIwf1NAJE+5FK39bAQMdlRu46V1OBCDgg18vVOiTLLbkg/slk5wc\nlAklo4ZluYuV9G0Ke6DhO/B2UuwEFwCTL7w4mKI5PaoB0I6aLLhFsMNb8dUw\nSrhowkKEWE0QLI1+sN2GN+E8jU5Ye1E7joUwfyXMqErCY5K0RknjufZ0lcFi\n5qPL4tSJHR90tsovFv5pPUdOIWaCeZgR04TTKUVtyBY3V29dDRZSzsW+3Dld\nzuBJZ8hg446sAmtz+mIqmPRrN14OFBCIDaorzsfQGxb3EXcCwCDjuc7BBPNZ\n0uiKOkrRcq5deVz3NGGkGcxOJxasWrSY4vaODChvMHr2OknMFfT/cE3gzOQ6\nVP30eorw9uDN16taVkOgKTaMGj+kmkBGLJh65MNkKBf/Cph80S4JjWOkITWq\nHngt7+JMQe/kUPm832jTSBwVVtic1yFf/MuyrvlwYHZ/kl6AVu9A0UVXZRgT\nBMInVJx2dCeOmc/80Z1QtKpaV4jpdhP1d7s/gQ9BdkLaklbbIek7ypFDSYdi\n/h1y\r\n=UQ8k\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCF0SLH5oc0AKuA37qc/H8bugXHQA4M6Efd7vDi4Pl3AwIgcbT6YYseHQwTfog6kBkOvRR9W2EH2v0oPXxP2VsKIbM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.41_1572301197311_0.4628445302009161"},"_hasShrinkwrap":false},"0.7.42":{"name":"@react-ssr/nestjs-express","version":"0.7.42","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.42","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"07c5fe9ab2b9bec0b030ffcacec506558807c25a","_id":"@react-ssr/nestjs-express@0.7.42","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-biVHdZqPnzXO5nMiqMq10yU3wSR0/Ur4GNL0wCGYD3pzdpwLGVTSF/J6xaLFNhzPAIBeolzlWu4iEfQCjNbZng==","shasum":"9f0e8a9c0b4b7c3e0a59e5a9a5a508d82c150573","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.42.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt2zSCRA9TVsSAnZWagAACa8P+wcTrbWwIWw/fPHK+FYJ\nwAzwyLkM6o7RudDO1QZW7cuxkQlDUZWFthC2M5ATa+AMofdZ1/NxjWJlqnsS\nTvVT1RvZApkMfgTf6XB6iSq0KOsoMuIPSD9C/LugdR+lnr3G7jfIaMQRrQd5\nBHwDZl+Wi47K7t34tUefs2OQLPzwlyY/gh7C+a6AiZQDN1gazEqCiNWiL6O0\nsB7bjgagA8KWgbF4yLsDi1ArMU+a/ZD+klLhLXIDjBV6sfHFLeFVdlj2vHLQ\nw5nlODSSfRhyWOdJIO21wMYlmb4qltBtzuqoJ7EkyehN24dTzGyCs2FfBGGB\nKwAOkwjoQh/92XbssooAxtUVlS/V9RNSKoKwabNK6BM1eWDWeP8Lu7c8OqdZ\nJmddWRt5OUHSsfBadI7RWGsgeTShdD7WnDa/F5ViTTJ06H1TSzg+05KjyF0l\nKjsW987ovrJhYlJW07i22PevxzvSnK4s4yd+1sLuIyxEk/d8SM2bPAUsQZvv\nwq7ABn+TDiGv/ad4Q2WOp+PLMqWbI4N4Npg90YoQlOHiZ+S9TKK6YDj8wVG5\ndWEf164AYeF9TVmt2UPnR9B0mCPk1fTrX6fk7vAzo+tIK6X1ipLDDukWdgxd\n/uWfyGRGQ/8g5ND5cwTsohfqNbKENzIjbURWlMnA1EKJOf3QVlhP34pZM+O2\nNsLN\r\n=mfBV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCMDsM9lW2kIU7c6MAAJrIXgzHBmcH3zOUkTeAvvRAzGgIgEAv8rOp7mLHAIWjdD8HFyeeSpE9kk7ll//y4v2Pd6j0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.42_1572302034510_0.10405138963614924"},"_hasShrinkwrap":false},"0.7.43":{"name":"@react-ssr/nestjs-express","version":"0.7.43","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.43","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ea1834295f269ac692eee43966d3a13d2d4a19b1","_id":"@react-ssr/nestjs-express@0.7.43","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-yce0KJGiDxPIXHWMPpFspiRVCjRlO5zc61uXJaCDr8oNAs+CWLeBSs0aRRi53FPfhvQmjkbK1Oqjs45X/vzRPA==","shasum":"cd593f5098f80b0a84678ccb8d43140f5ef7b016","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.43.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt26UCRA9TVsSAnZWagAAdosP+wf7ZGjTbYJwQVi4lRRa\nWxblj8drCrwXXOh3Tb38UIwiZkQRumTPwItDG051ihBKagRS7/U9FfGHIjE4\nFEB5GcMidr4bseB5j2+hOiGrbqzEFNj7/Pey2FaJp22nddJlalUQAO4xndu2\nGqM62ve47rFo3kRbO/kUpimGRKQC9ph2bX8x+4gRIARz38lhj2k4gJ7fhoT6\nyDTfajK+Ehvgf+ZxZiHnof0KwJ3SAGXg7fz78v6Fj2tOxNYLiWUWT9KBK5gc\nwjm5M3NbIZp1X6EN/ZwgQBoaHwfqrX+UOzU8Mzu9OvjjyK9N98jX0E8Fk1B2\n29V49zcwUpoMRP1GaVNGk2JIAc1WSvp1HD8QM+3FoPVEfAIJyeT7dw/wJG48\nj9LLCHzxzpUjS1MSxwKKk8XQLmAMFV1fMNY0wWyjrJ54uKO3oTwhA/+SRdaL\njt0Bnp2TZxIWC4UGqoWfuy1kf0aM7HhmETGjaU05rpvbskjH5zp3KBDa4YUH\nnR541REo7o7aYWk7vyfkvWaH+eN8WLQmyUzFcg3ORWXBlEcCSGpEdfSI46H0\nqU28HLX8nKsAUE0DY6ebo9U883ib6gJPug+lTjfv5fO+B2xhXXoG9U1FYczh\nI73dQDNi9zUpkTG81lQmLJXOb+Hz/ySaSZoO+I45V8wnAjvexCWN/pzztJd8\nJdca\r\n=GCwl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC3HzrC4hlGOILoHpV/R3RXWrcAGjbI+4+ltUID9r8TqQIhAMOfJItTP+/Yl1ycXGmnbP6EAA8DrvAMrbh/xPc7GQOp"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.43_1572302483907_0.6573623054709539"},"_hasShrinkwrap":false},"0.7.44":{"name":"@react-ssr/nestjs-express","version":"0.7.44","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.44","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"af2cffc65933256152d439959827d4d46ddae2ef","_id":"@react-ssr/nestjs-express@0.7.44","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-E2Si4s6uZMUjmxIjtt+a2uHH0L19MyhsZ+CyPe+8P8zREiByaDPtBdHBwsRQzB2LSmL61lBYjyTOMg7BO2s+7Q==","shasum":"7fcd3eecc02d43c6a12ce8ffe067397b9c1d5e99","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.44.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt2/4CRA9TVsSAnZWagAAY58P+QF3crSg+IeEYirJpc36\n2FhikxbnLxaJbYkk34g1oaRFK1zOW9lTaBcWOdnUUYcai78gavj3kYd9YQDA\nUCjSTAwQD6KYJ+QjPfzFjC46fvOimb1qskihdYdfXRP3AzDlt2MMms76qreI\nOk7CeOQPoFBErReQTzznGIGnz+iCOdsQB9Pca9ArSJDAXBGgEsVAZQaXXOK0\n3M1di64j6kMuhtjpWlHiRzCYLeoskt4/+TvxhqSGnrNV4uuJBY5g3agg6Ocu\n/UFLQ/VSNdQxafPGMTrD71a1rJwfjYp9j5gW/tgFb52gujuarB1f1R28qHhJ\n/XdOek84gKJLgt3ETjrKItpgGwWNx673BL/dS401CQmcOfRhvZ6wCfpguttu\nRHYjjkqGKmcIM+6cclTU1ylQECNiz7YI42fUTpsKhM/erSPu10dud+UPb1aZ\nZrZZ5WeibCAfAKcU21jUNQpqIrS+zWz+HkD7Icn4Ksi00mgWI1gUs6YQkorY\nQLmFuQC8qaXRZHliD6XqxnUg2ptG1cWQZuoBuxjzOU52q55cZez6knF8djvo\nVNB1d/UbluDpSwPVIlXxEtcDDMX7vSZgI2t+/lwfjymyowEOKDs3Nrz7qnDl\nDJw7hH7obP+tqEs+PbAKplQ/tqxABZWwXeFopLvwGNKcxGqOrU8vNqWjflx5\n9uB6\r\n=/xvt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGaT7P/7QKERzrC0bYTEwTHxUOsvvowXQtEO97qnDwtXAiAjxtUZgSq95qu1Az2yd3ELGZzY6Aj3X1aTLMcC04GO7w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.44_1572302840072_0.18480797286415562"},"_hasShrinkwrap":false},"0.7.45":{"name":"@react-ssr/nestjs-express","version":"0.7.45","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.45","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"30928992b43b55621e34aa104486ea79a48de6fc","_id":"@react-ssr/nestjs-express@0.7.45","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-BVthQhstCh6IwM1jkDAL0p7moioqItNhq9d2gU8gBHOIbsy4mD3R2fibckbZOe+B4M98hn4dGuYLmf8X0q2NAw==","shasum":"78ce0321bac6e2a3b4e2c4124673fcdcbba22b67","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.45.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3BlCRA9TVsSAnZWagAATgQP/259z6qXyEHZbPK0xgG0\nMhGfd5wdj9yo0OybAhQcgguj7RpXCuLpfYDdF/GRRFhBp2q3OYgchSp8XisP\nFB4rIqX2Grhuap5URuWje8MMxZEfzH8mW6HuPyfBjuHZIDmCSmzkQV98oq4p\nurxQ1SlF/XDEzPMpffRRZmKWOER7wlnThuYd1rZd3cYPRU2otOsJDEu0HiGa\nsCyrFbjNEBk7twUvswyV4Jr0brkLnxDF0YiuAm88KQLGhgD4urxQc+e0hnya\n5X7L1GlMsTNncLzjrqYoPHx/ler4fx0GlEA9WUl5sIbb128UVMDRx+xJoVXS\niqstjOoliE+fsf8q1vRigbj5dyBZLXoYAIFNnqyGEvXQbh0P8VP/x/QPOEN0\nq90p8mEz1sEVl5z2Jdbecfkm3a6JxXhU3bCRvq6CFerDWQda3n80vxUkwSqE\n280KIF92sKBfTFjas0r+y/IqIA0svZIBUXyYWYqck1KgKrS2kYsx6CeyGUPC\nw2OHN3/k12fX4MvHy7BrjO+9RU9BOhzp51NIqoC0fHhEH78EA6PoUA9mRG2p\nJ7qia4zD07PtThZu0KiwAa8KN/E3eQP+2Iog3JKJ1jVwuQv5gBDVzKRk7Vgq\ngclkEzZdcPt5QdckF+IW0B8NBNlCxQ2PrmcQcItzaZ/tmp6dhmPgo5J9yhQf\nfDeS\r\n=AsaY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIG3Z8/PJxOfcKXL1XYK7mGyUT3pwp1fp0q0bZ/oarntcAiEA+cfA4SNI5bGlO7zqko06YvzZUvBTDu/vTht9bhBkVrQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.45_1572302949583_0.6621567133638904"},"_hasShrinkwrap":false},"0.7.46":{"name":"@react-ssr/nestjs-express","version":"0.7.46","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.46","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f5034bb83d4dd5386cbd3e9dbc6e5468c20714e8","_id":"@react-ssr/nestjs-express@0.7.46","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bHx6/IiwbrQOl08voNeFeah+W/gQoIdfXXMT8F+hvbgvZbFISqv8H0LKV57lN/yjdwRf8fMLnNgyHd3xzWvqrg==","shasum":"6994050f90bd5bb9c8efacee2521e3d05b078a7b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.46.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3D1CRA9TVsSAnZWagAAHkYP/iSanO6gt55eQmAOef2i\n6n748hLilcBxHI291X7jVBgC7cR5qASV0RgqscXzZRXyDBRw6HU6822et2FP\npGCK1PCJgcoWC5AedxdgHSwYZGPC9ScxaFOj9AVz2YG/42GW6J7+uXZvyrmc\nsY1QzFarlECwjUrKXYnrjfNdDQHcpU6YLuBqAG2yodtLu7K5VuBo5/953rby\nfvfMYXPl12qMaXAhhBMUrIUKD0MZOUTB7f3MP80QYBLDJzjpkwV2jEGzZ/vM\nd+cvpl7O8m74i+DppUocZglyB+iOGdXNVrCmsWg9p2JpBdf70I70TpP/OysR\nixqZsmOUOMJhLOLWAeAOo38O8+OtYujTQ/sKh7b3v2FExHGOjHvV3mlZh0yZ\n59/HmmVJdWJkFTPjYSJpRgsvJtPhl0KsniFhrIawGrVJGBhHuDuTHwXErrxg\nu6xLH2AiPOb0tSzxL9T7iDq/dXtTVlCRW3pYj8EDdgYH0DMKfJHLlY7VsZO0\nPpYFY6U3Agw1lNeWcncfmT/VZj3UxSgXdjB9CDT9RQtNbG2FtxX4HQWJ6xGj\n9PIPyl0TBPTant3UHrGUVxjKZKm55DoS3mk/KlJQDaUn0QKKyoePkqN5wqoC\nOUsOAjI1bUf9k3TrwfEdNj3xrC4bfU9wED8z62i23+DYHot1FFMdMb5e/QNw\nDwxu\r\n=znek\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDfNF+LTHsGJJJjee6s1v7z61t2qJB3hxMhbEHnakA7xgIhAMxv3EFqUvs/QBk61dlp87R+1sVI3w6yDKNQEifcLIid"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.46_1572303092924_0.014127805213162814"},"_hasShrinkwrap":false},"0.7.47":{"name":"@react-ssr/nestjs-express","version":"0.7.47","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.47","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"45404820a449751589848c4d4df48bff67d462cf","_id":"@react-ssr/nestjs-express@0.7.47","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-qYVmFsCwmFFW4WS2n00Teh1qXikTWRkoYlaL84QfpxbtVEt3KjIEKGDOQJK6K04ftSRpLmRlRnplRtEQ3v9fmA==","shasum":"c27d4af91585f41011e2062cb023991727a6a6c3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.47.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3I/CRA9TVsSAnZWagAAs1gQAJOT8EpXA7pYzLPx4Rxk\n1wATSiNUMIzSr1cI5JDSk3dQ0oAsd4FaxYzF/hXLfJ9eZHZeSWq/lSG/93hY\nmL1fut9D4UNAC+Z1r/Vcm4bn449s4s084F/1KfS/oa7RbTAJ0gMRwg22KVTf\nC/U6+EvD0uOsZ6PmG1EqToXNud0gW13DNc9WoO+hAEEtPIE3sRP7J4VY93tU\nO9r7+Ycd/5uJzv1xeQqYssgijROBY/UUuhYTMIMAWDv3d477G3aIiXJ6fiBs\ncv570wsiKhuJ2dXVQgkVKbYzbXIRzzr1IwrM+ZfdBYt+bNfuTh/8uGFcLVAj\nPNTz0qpOJVHkZ+ukRgpwEMHeqxVXT3EHFJH4jW/8gJZRLV0t4izqyv6iQikj\nZyoP8wfR8knVBj6aaM6KR1f/C93sd4E/aep5eyyCynUx8EsgmTGbsUNL2Wga\nhApPrzP7Wd3R2+z07k4ldyUB9qJYiWyFgc7AorGpk0ijBuH8dSfOGCAgrR0I\na0e3Y+nr9Sdv8jJhVCG6pkh/9hLspiXrrCA+jlxb7B9XrmpUIpc/niHCKdWY\neSw9nZY3sdGRVzakF9C6tc2DqHXV88LR5eRAYwx1thDC7de43iFW8/N6yrTr\nkAeNX9tPcW+YL1v28ZWS+IlMxxBYIhlAz0N7QjV9QXAqn9RLaxbAyC/qYGTo\n64wj\r\n=ArqR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGKkEkiI1A4DoimluzGFn088hORZvkV2D10EiGdjnrwoAiEA6oFxqI8rBrWv8ubBzUHYytx2jEdvovpe6aY6cWzxZw8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.47_1572303423060_0.20052036567272324"},"_hasShrinkwrap":false},"0.7.48":{"name":"@react-ssr/nestjs-express","version":"0.7.48","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.48","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e3a04981cd4c372ba8949a086a9637747fa9ac97","_id":"@react-ssr/nestjs-express@0.7.48","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-AFxGAa4bFHIBGIfBVZ5/zE+ifW5B5j5M5Poa+Vaibhhi6Rq64yXqTGf4oRWkHQfZF2A3/8KQviRJ/dYhODUYuQ==","shasum":"4a084251e2ca957a4ce3e00ac963a08ee26a5f25","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.48.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3OwCRA9TVsSAnZWagAAYs8P/iKFDJC885WrkI6y2bUm\nzyR9mduU3uWlN4Stpd2WW6OFDO6HLVbO3FBWw3GS1yZrFfa68MlxPboFQ/gT\nzg1u7qvpfCtRrSz58AYBmXuWHk6Y5OmFCqjdLDeocbaeK14ntxf6bYtKEE6y\nQoRI5ffRBin6KV7xjQ4/Wcx60VVoQjBYADzjMMJaqHHqoVaK9uGSuj5WrycH\n0PZc+fr6cLg903fq19mNhnxTfb6kd+920eEnPBDu9Ar0nFmkKKmAR5RQIJBt\nE5Q4VdzT9P7dVZlo0cziiN4VSxBEEF19QN2ckO9q/qg3uX5cebkF8IWgt8yh\nLM0YmhlDgIOj01uFM6epb2j+FJ8ww3tWZfuQEEmN+FpIxoaf4e/mWVEXUwOi\nHeruEtehWs9bjh3jTxbtJJDjOIaUHyR0DqBXizfMj8z4gKcpWaTWv9Mt+IL5\n462BScONBMioJfld6B/ppIYZwtNCE5IXpkCKDA7URSKbvq5n1Hcm6hGUymlD\n3nZTbhj5njUmgyYHJ3yMcseIEha26miqSJ6bl/5RLSEl8/NQn25OmHADVtGO\n3pkfi1RkXo+2LmqdqDcdbRhnIC3+QUAfEHx9flYYJFytoS/cEpHjRcpQDy6n\nKlBvbumgPDQ1Ic+JfM65iSK7c4/Cy0pg4nCt7LHT1WXmuHypvSCox9rxk60C\ntifv\r\n=Sjv4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHysV2NrrZDy9aic7rMSty0b92Zj/r65fiPDbpJqZrvtAiAFQRGLHkm0RO4/uGyBwYj0cnqIdOo7cuZqPXmaR5xU9w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.48_1572303792338_0.7203648566332976"},"_hasShrinkwrap":false},"0.7.49":{"name":"@react-ssr/nestjs-express","version":"0.7.49","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.49","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d1d463f6edcf14ad55c22f310b0cec2d4878c3d4","_id":"@react-ssr/nestjs-express@0.7.49","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-KQufx7vybOoL0ZH3tb8gjMNJxrSR8aIK+i2EN4fDO1Htc260YJ11ZNz//fg4VnwxJ0TWrnjGa+ysXFfCftIGjQ==","shasum":"c8a527d86d5fd9562f4c45d36266409935ea75f1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.49.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3SzCRA9TVsSAnZWagAAvFoQAKFaJPXQ1OQQ9DtOcBvC\nXMsV1Q8YQwPpEooAiv1X7RhEhPjZZMBvDCZPUpoLlVa4ESsjlhdmgK1Tucdi\nVXe/cgUs3yLVH1fXNUMmYJC9qHepF7M0VLfcUSExD+C7CIHnDDDOJwDiN2eS\nLwdo0peS5IaF9Y79eH0t36ecjHIY1dUmi7p0xyKP86G5G+zq/dXOCSduLfbC\n8Kbn3t58rH7yZ5qsFO7Wx+QWDraTEv57A3S8crUgGb8VVUBlxGaaIFsUNK0q\n07rU6OpCGzJ0AgPDAmzg35g0VuP9WI/O6vnNjDt5mM2hGCiRxkrIrf+h0vBm\nKbLUGz9N8MIv0QKcDd+T8IBa0eNiTGeRwU1GuYLHZSMfXynVMKGgMJNFD0L8\nmkRRm7kdZB79ZIbHbUZqm0uth3TyMOSDSqeDknbwjwLUCwDYp0bWY6pSolFZ\ng6uLEaSD5K2eljE8yTcikS7uDMAiicYsLH+m+Ns34BFFop3EqRMIBcbKLpE2\nqjUaMbb21ATtPmCAltySFrES0G7aMsDT4Gg9w1T8GkMhnEll66fQw/v3o6UW\njaq76xFOEBuNmfgvQG2SxDgHasvh4423bbWwqg2trSIVSz3mzlJRG6NdhYSv\n6RtyHesHUYtGNgAw2nofTtuCDWpH+85GQP1YN0rduyYWH4Msdwj9nZJN9lF6\nMfS+\r\n=usSx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGROS8RtIj5xFQ0SH6MLtp6PS+7TjNhAS38cT2CpSnoVAiBPYVohRoQfepswJqNEGSee2XeBK+eyDEg2+PRMJYdi/Q=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.49_1572304051218_0.5137256290510617"},"_hasShrinkwrap":false},"0.7.50":{"name":"@react-ssr/nestjs-express","version":"0.7.50","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.50","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e097cc086a7b34a9e77ffa04cdeabd20841190d9","_id":"@react-ssr/nestjs-express@0.7.50","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-PKj5AgeTKp50PdoqoMcmRHMJYphVuIJKnFPH3YhVCi5PbAGpmhJKJ3/OgPg/QvWaHmPErwYSSuv1FtsWPLgMXg==","shasum":"22ecadd54b8465a9e1376a3cd9791bce565c3ec5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.50.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3XTCRA9TVsSAnZWagAAo3AP/iigkr8sWMotEeCOkVs7\ne4rIztgP2R8ynmfBI3binRjK82L2wYUE0GXRZJ9uSqtiqY3gaP3IZ6DC+FpG\ncjo9LeE6z0hpjLRT48FNxHtivMg7nUD/UPr7cwfTrnnImiDMMckQk9fOMR+6\nCz37K0I4pdNa/xyRlwP0wys9t+gFVRb+g+1fTNGYQmWE9qIxO698VqtaX7tZ\nxkgpL7O1CneDYCIRvXy9GMBEzXVnhevp00k8Zx/JCVRMHm0brwngF38AotN+\nm2l51BNRAHQn04nXE9+SoZF/bGnabxvfromnHiLxoiY9puwDefCSO22bwQSm\nd1UdCDolXOAT5plOpFCCDRPGtKbgB19noAv023d0FuPQwMD+qKsS/Kd7HBkb\noDO+HWa0t5eboxUbGh6hU7Z9CYuiAlCUw9QiSSVOKeDQ0bkLuCCXfDqosQEP\nIzm+Tyj9Mckcls6CpSieN7FN9u3eoKUPIobnMUPA6wEZq8J/JKTIpbb6fDWh\nsqRGAQq2bRi1qCewNFUBtuE/5NuVUbOpxKYhG5nZn+R0uHwBvnpA2ulrsC2h\n7PgQc6Lh0hc7dmuvmbvHyMO0IbHxR23DC++I95ZkGw2pZ9U8DkywW1IIon9H\npLY1MnFIiuadzRWA+3pqXgNiRpLiLDga0MM0MH7nWH+XqOW1i+WZkFgqP+tC\nTkPe\r\n=LH2I\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHm6dxEdhaQnJXYRnoxMSy0SDzcwUNQJlIjxIMmSrpZaAiEAxV277uthiVUoB+v6qC4e2S62tYlODjtDqQtW35ilbGo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.50_1572304338731_0.5406139770692544"},"_hasShrinkwrap":false},"0.7.51":{"name":"@react-ssr/nestjs-express","version":"0.7.51","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.51","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ad35846eee2d03565619a8639e736c0a7fa020d8","_id":"@react-ssr/nestjs-express@0.7.51","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-OLGSre1rhEL7kGt76NGCQtZGXnVvLejBuMI7GqzBoFXcyx3Clijthr58acqdjqn5Dj9U+yRAUjjE4yKsOxWr7g==","shasum":"fb13c3653622002f8caa48c029cbd35b926b4008","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.51.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3cDCRA9TVsSAnZWagAAsLoP/in85IrGMfJXTGp7ZeEL\nadSsFE0axTWJfQgzr6STvvoeYV6YlbX7wyX4Z2xOHThPWbcHIrwNw8ZYFZbw\nCLJcy9fGOxqqQDVfYDDk1Qf5qddJm9R922RPoORc9yeFLmR80RVWQW2nXoKw\ntMJXSOjNNXP7EXd0O+LkNvb2mw4cdeO6L0m5eXRtZwFP3F/gv2ZbSRJWVCZA\nZilmsUfXFmKonvpm6Hh+LqQzra/1XKNA8+H/sao5KxMFQSFfm1nbmAFtaIWz\nd7wShEXexWGr07HuAd9uhlals6Pa8blk3rd5lKhWh2BJW9r7pI+X0usI9yN+\nNlkvYc3ikxmpSisyHpUZmA1sYQy414N4LfYog4Hu72po+y8S8/iJqGnVy2c2\na1v7+82JRqfy1MOLCeYCl8cc6jiywcLKa7h379DfSz3ozfSpzHuPk+5Wj2J/\n5nrd6TaJy2KAnb57+a/s3KZ+RTqugU1w1jw7/FNNb5Lw7bpLtn6/vxOvsYls\nlLY5HvMgPWjM6j641oqv5I62EOB2yR/VoGsswNWz74ov5OfxD+k44Q3Onkvo\nP1RH7i8wXW4SgRnVqRohnn5o2ccAsadzZJQmVp9BAtJluT0m1iTq0Ij+uNDz\nMpE04rU5TLN8EkJHB1OyM3+TUJHeRGFB4BTJfdEmz3KKPZWGxYLPfQ1WH5XR\nPASh\r\n=9+Wq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC2HPSU+IszwzVW/TIslQnf6LKJiw/C+HEaE9X9U1V0eAIgKpPUgaIkUA3BX+t9uc2n2hvDCo95HMCzQY1zgVfuv0Y="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.51_1572304642592_0.9094973311146988"},"_hasShrinkwrap":false},"0.7.52":{"name":"@react-ssr/nestjs-express","version":"0.7.52","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.52","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ae6bd378f9dfaead41a4192b121c647c649d0fc6","_id":"@react-ssr/nestjs-express@0.7.52","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-uQMluPnwn4JT1VEg1WmgounlQXXcyujBOcEqizumF22OjZP2h3npTM4Lh5f87WnFP8b58KE8WIuin1idGI3Pzg==","shasum":"ce2a5e4da0997c1b54feb320a1aa91276b0728a1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.52.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3dyCRA9TVsSAnZWagAAK1sP/1Ozr/cWmBgeosWrzs3X\neoIrBRQ3SEVWXe9MzRk2ogj8mm0AR7m3REMJuVMkhy/rvNSPbpQrj3PlrUju\nAmc4Nc8ADXd5ba5LM+5c6mQQvh3L4kvB+U8h16iklVNCmXruMfuOcYoFlhWc\nBnYAYVmmVVGQiPndunleQhtiWN9aWUKExPQoiKaya2XkkNVjQSZv2Kl2sB2z\nl3QuS/rM7Mz7NZpz/5ZwHm7AInkz5isHgurm6thqSTswSu7JvhpW680tBdtV\numG6aqCuF0Aoqf56nXjj2xZ06+/S6sHZDdlV7AAOM0oUVxoTdqwe3ES8iegS\n/8lCrLr5b6oOb57aumoE8VVJ94+GIJ7++oOj8tXhm6sRb/23gI216AFbExVP\nFsv35PZ08iLtS9VTwBFwATgqVCvSiQ4bbCvKxJhmMTjmhaNdf605XeTALeCa\nO51aSjXdu28twEaO13E84UDftKGpaqeqLX4ZjUCbduMkCvRPkGEl7ctMRn1Q\ntq63x7heRlTaax7nRB1vZ6RpHV+w/G87wQLFBhyGYeITofQkPaKkJBnI03Rv\nvYNo/iISjPMTyknzIZIMXsQ+EKVcaDtZ8/lNy5wf7NqjDt7GySHl29IsaHLs\nBOjSV7YxElau6sROvEOzhKjx7qR7xAUe3iGZY3prPYX4wk0tQU2TwHFDU5pu\n1wYu\r\n=LRs/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFTEAQpmS8S21bYhPdqTFzvDYvFAXnkJ/4o4jMO6Jz7+AiAPIsXz+v7MWvBiNgkin5ZD7sqxBoxWB8L+9uqRTNcaCQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.52_1572304754427_0.9751358672020076"},"_hasShrinkwrap":false},"0.7.53":{"name":"@react-ssr/nestjs-express","version":"0.7.53","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.53","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9544d693f9a132417b13009de345d491350eb957","_id":"@react-ssr/nestjs-express@0.7.53","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-jNP6aVoKTtzD6VQwCUD9dtS8wprk99OM4Y+WYVhGri/EZnYMmnSj/MtuaDnpDc06jwxs2GyoHFAgZHzVwfWSxg==","shasum":"745014b2de826f78afbcb3edb528a91a0c372390","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.53.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3fpCRA9TVsSAnZWagAAbnQQAIvNZabXNZCKcwFomRSm\nY5czWtFqTe1Dl+DLzSrJBSkaGb3g2oXtXLOje0eDCoiDsHqdcM0vKKKgZ6hh\n5W5TIaFH0i27cfYoGeKacIS/1sFX5zBT5cCmI2Z4ymJOMIhZTTRVWlB3+6Mx\nqkbNqZdck2J29BggWUMu9WZM6z/OTPwWBpRqcnf68+eat3RyxqnD1p+IWWiV\nqLSCBkY32SzJshIXCyomqbx+quPqcDp5fNLbWsWZurQhasV6MRK0B8Lc8Wut\nrXGwFve8gFvvGtwkgws5k81Fz+ADLiB9t/0qKYLSt1lkmu3+8Chs/5Uq68ZK\nJ3UOfUz0N5vNz3reBYGLKcSRgZq0pn8aWaD5do9j3Mrdv3n9sHxPknoe1gvp\nak8bap4fMONBypvOUzRU3W2RJXtH9PjAOqM/t5vg8gU1Qmmixv11+RBzZR1C\nPK9OpYXT5WoIXBN9AbJO2BKOcl4rn841EArP3gpUGs+g3iLQBQfQawrm57w2\nG9/4/WGpCyklMOKEjKXJZHGyDWt9OmmgcAj/h6Mw6xOwVJy3pChlw3zQarAY\nKLDqFQycfPnqU0Dop542v/+XSE21r/IZZt2SHHcgahZRB+4Ri5fM9LM/EC2X\n0BOGp8uhPh84slsC+YFU7gXaodhcwHujZUx6OafapQOLYaqrzCXnBwxHa7Mk\nFznT\r\n=6eFD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDhst3skU5LTSfe46dNxfPBp8whuSI+AW5ONlUXYtrgtQIgcWTzSBomm96TKlvkCO8KW4FQeQ6xRgg+yqG6DEmt2fE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.53_1572304873377_0.9810673802982646"},"_hasShrinkwrap":false},"0.7.54":{"name":"@react-ssr/nestjs-express","version":"0.7.54","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.54","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"04f10c799d0675fb37bb30c58ed2b18aee600359","_id":"@react-ssr/nestjs-express@0.7.54","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-R2BfZFXnqT7TbZi6euCYApgvmsIWQk7LmbZBpbKViv3M+b/UN2IXEHbgXlcQ5Wjw1N0LwagknzrsPZmBkyp8fg==","shasum":"070feefe3ddf23b33367c5a8a7ac087b5c0205f1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.54.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3jHCRA9TVsSAnZWagAAHZkP/0iieMUi7KVoiB2Y/kB0\nMnLcBK7lQLMY0nAi4K9ck0CGGAuaLVaWFTkt9XpQU734ddtr9574jUDRLqyf\ntLaKW1Coo6+XFrKA/JnBzXNbMTusrBWxbzooOlv5TMV7s5YsSWnYLvyTS4tZ\nSDb57O1UW7mJhFMhKx7aso75MZ1oFPH67kBlV6Ow8Ck9i1JqZ+Cnl8ZYcUih\nCfvJiI+e5/Yh83LqW8rHF0t0uVC2ECHG5p/CBSFidZFwCzL88nP3/0bjhkgx\njDbGtuvXkwb6McQyj2ywguEZ/NNE9xKF2ryEvo6PTYPLhWGnxAielXHLAJl4\n0EtB6svEHLcUetA+ZhR8gJpOElcl7SNb9QRfSzgPkb9/bsxRR+mApMjmvkHM\n3mubuv1dS/KtFHe5VZnF5zM6EpEHqEv46mI8Jq11eECr1kRIfGI+2uaMsFFA\n29DO75/UOyxqHPi9dcaz9nTeYc9zLDSuQaRteFGq92fOPlFUnhXdmVdYb0Ye\nnHccK9JiEBkmyVEAX3IiBGgLqhho36X8AieGFvsfKZMayJO18ludPuTAXvLP\nHziq/Hzh03EIw7qixWAfWgvfxtlbe65gIufNTylwPdnbn22DoosxBbbvW32A\nxMsCU2LZeECfHL1RMVFYwVms/FF9qC+hpSQGvbbkHbe2bpIiz3t1QTJrTCUJ\nx9ks\r\n=B6EK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAPAHBGMeaPcWclCmj47llOQ3ReQ9lTKJ3C6vvI8gHPGAiB79NYLJ0sY3ndOGzLtt+gqfqgZXkoOlBJ1cnkL00jWNw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.54_1572305094784_0.26287426337712905"},"_hasShrinkwrap":false},"0.7.55":{"name":"@react-ssr/nestjs-express","version":"0.7.55","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.55","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b5f35c16d8d900645569eab060a8e4a7da6c3bfc","_id":"@react-ssr/nestjs-express@0.7.55","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-a+7TZm+247c6pKbj6GLzVXCIlBAC9BZ6GuQ1D3pG5N6FLA4wikSCWtwlncyGlWdWABljo6cdq1YvNDzpGy6GqA==","shasum":"dfc08da6195fed6de27687915c94e37f364d0aa4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.55.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3mXCRA9TVsSAnZWagAAp1UP/0hS8JtuBuaYOvPNlAf6\nxaQm5lkH/gs4lDBpzJ1BcbPCmP2hyVPYsurY2hTpndhxZvvm6Zy7vwE3VYyU\nmsLB3Deyx1xCNs4kr2tlgDM9UCgvrGzdXWcpPxVdyloLPWmq6LoOTe6Ma6dU\nBmb6ULQ9sgrpcG7nRAQjAJzrvwJILpdxUN7tPognq+M0top+IWkhBD8q3aVg\nShwOL8Ohj34+8U7u7rTRxM26DEjbJKNgqfA71FI9U6G07T5/qgsOalagNVbU\nJXhFnFvnO404JuYA7pQMEyKYRR2/ZTDqIkB7g1WsNoTFFB9jp0nR8HqxeNfB\nFd3/PzHEF86VbuET0svXT2JuoBuHyGNvTABzDg6T8U3q2jpfXAQiLls0BXDE\nF/hWyFAqvgX4nzBT3QogQzkix7anV1mZW4eWQPYhHgrpqh9IJSxdt8Ulpgww\nasU0iHPwUfV3VMUDg0EgGZMNcIr0OjHAcSuK/xiCWxRkQeaAiUkEjuIcUWvE\n67uqjPs3a6A2yHkI4EmdOy5qiI6Gz7yN6WEF43C+v+xis823kNICiRqZCVHy\nfK7aDYK57ZNZ7l1bPfsaRjGrLIOB0jCnaaGh9kizVejlkVN7MT7p8ozgYezI\nOJh4M9QjUk1ErX2tYyThF9YI51vlLzyKbSAbYwWZe2qhI/t69MPh0RjoS4Zy\nLGQn\r\n=Y9eC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH67v+7aDVl/2vuGiHM6dUPgkwqHJAYKpoleon4hr/J4AiEA0zcoiMCVHP2ULXKtXv25IrzqlyChif5wYgSoRlPRY9c="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.55_1572305302662_0.6501468777805783"},"_hasShrinkwrap":false},"0.7.56":{"name":"@react-ssr/nestjs-express","version":"0.7.56","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.56","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a44043b24b2e59b0f12782bce9211bd1dea985a4","_id":"@react-ssr/nestjs-express@0.7.56","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-P4H8GRnnSNaJiBKlmyTuiMmHp1vA0cpqdGd/2CxAZDOwxcWJqVDvQYvCYx+fP4/D5DR558q26s6raIpXatS+9g==","shasum":"517a35d3488bf134e5a8d0618df8142019ce2d1a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.56.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3osCRA9TVsSAnZWagAAUscP/jWH3szH+JF5mWa1GRiq\nsTWw9s+zH5XIZvBncAg0YvwasbKNB0L4rx3mPdeyoixISaVZIBQJhVCBBGi4\n3MAFu+kp2e9ynbcycqrAeNSUllkLNlISBGZmT+cYQB23OwAjc6tONZvXzU0y\nb7tYs2QYJBbGHKYMl/zmICwy8yOWDf6VAKkWIsdP46Wba9qfOaEh40maK/yA\n1tpH0J/gWATOouhfr7NZ47qxZsVkomEbFj5Oogt0jLc7OYnW/ADrq9tEueuc\ntCPAw0a2uSXPPXquuuESy1MipCJ2DT9eiygvt1lXcolOeEEZiL5+JB7H8gkQ\nGXA/ddScWktzPaBTZKsuYJ87Yo21zA8Ij/cKJqkF9NwY5FJ6C1/dlg3RXe10\nzion654GaR//bausJw0m5pmwDsStpo0LiZqe586FwIVLIB/k7WNxkdzdi8lr\npDKSSyn7+Q/TYFbMxKwMcCBs9iJsoC9MGmARM5ZaQcV01x2zXcUAtVx+VMp6\nuoZFE11YGvfcH1ro+Ovs3GeExXMN3ZpiGCwh4T6riSn6j/pyZAMomqlz5CG3\nmTWP6CsykGWNLUs+fcgJXuBzSM/H58Yas0xN5rrd9JqkIBnKA8LiCsPJQsZW\nvnOyTPJV5i6oISN3PWzY7FrmwADIvl6Qib9FaMaREKEWeY6tqU/hjfKqGHFR\nEEJK\r\n=YJVc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGNR27bE575e4k02lWiL8mEJgPfb2BNUGXQ5lQnLk23DAiEAhmjecvhXONCbqCJUZHbx3ClqnLWjtt1zepTd20C5oag="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.56_1572305451550_0.15296713957399133"},"_hasShrinkwrap":false},"0.7.57":{"name":"@react-ssr/nestjs-express","version":"0.7.57","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.57","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"94a1965de8fb035288b14bc9cf87873f71341fb0","_id":"@react-ssr/nestjs-express@0.7.57","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-b0Iu2EMMuBEm38QgBIUJj9y2YPCO97E07NS+GoIUOStUo5XwZZSm124H8CN11REWEfm4iTSGk4KFo0o9zOd5Bg==","shasum":"ea944e0b7f2b6beaca2475b8b5c51da16886993d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.57.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3tGCRA9TVsSAnZWagAAwBQP+wXIGQMRwmRhsqTqt7xe\nmL06MLpQCXnhjZP9lXgPBgqZQ3nnEurtDY0Sxm9fAEqvTWLAlExjwNG7HM//\nq69ww3W9SXx0nTyOPqW7i3xyqU7DKhFNykiaqByXoxg6gS2jDPomkG8pMfaR\nwcOu/fiqNX/QrMde227gxAq/yCcGEWGl502h0d7Fp6t6u3IUVzF95iyh5Mhb\npN6sDmjc0nTNPZ22ZSY0p7efuOR2mrBogc6QOMTfrDxe3MT+E/cowwYalBl1\n39E0FzeartrG8AmYGTdtIBb/P3hOt3VWdvq7QQoqLBgNfmT1X+iTRA/Y0eam\nlo/aJ8MihF+OhLmXNJH1iD8Eiih0plTQv8SxNEBwFM6bA1pVN06ZIirTP4V8\nkG0rYYSLejSjlIXWOGkOw3e1U5N46gBBXaYVxy72Ff2GZvnvjWR28i+CWAbs\nzM5nVzTh8urEWev8pAEeQaDO+sgRABHazAePl6NTRWIt2b1Xt5oSEGA6Jkcn\nJSxnIVqnwe27E3mtF2cIK34/H/eGR00emX7y04M0JKQxlzGJr/nxLr6FyJjG\n1bF04LBlGCKKPGriGgtFAF5XUtvixWH31GzW0qiaZGVqH4ib+gKVh6W6CU7A\nETksYibiLDrgw+kj0TF75AS8fgv+g1S6DLM96RnwMHuzCItP4viiuhFQjKUz\nMTYS\r\n=c9YD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDmazf54DLgU6+Kb/co6UXx0W2aPV5kbeHWBiyElNa6hgIhAJpkHmitHVgOi+Yg+H+Txcf2dqZONM6VuyV7F04VgLBv"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.57_1572305733972_0.001702227718207272"},"_hasShrinkwrap":false},"0.7.58":{"name":"@react-ssr/nestjs-express","version":"0.7.58","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.58","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"18b3e172f7c50dc607fc10875a4a21c879dd4a73","_id":"@react-ssr/nestjs-express@0.7.58","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Nl736ZM4lsr8RofnbH/Y3893S2kPCGBWgNlVNrYTyMJwWWK8GiH0ZmlNEDYZJA/PPqpVePNCC/7cKrFpvhucgQ==","shasum":"0735ae2e3d4c0dc50b619c88084a903b995da485","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.58.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3z/CRA9TVsSAnZWagAAW/4P/0qC1zRhYcQKZWzx9EGL\nOMQsWt2hQeivdNnWMnMR6+9BMQIBNzIJSBrITCuXt1fVnkb16b7Frg3Ztz6I\nFxterlSyO6CZWlROqCcaSGO8Mrv3VuXm/L/O75gfbzWpRz/II+8YriSxYhtM\nPEQcbQJFnxqvkwraAFe7ega9KQpoDJ3Xd3kDk9mhZHGWCUfRo0y3u4EAgeGi\n0wDWih344cRF4ZhRd24jx51BLGs2oZNj7qTur7V373lbL0FcqnQjNuJEOgLd\nd4PtJRU2j/MuPsvQl7jQ8/69BqdEhr4H78V7eAq1+/iuZoNfiKFH8aTaSjs7\nyqJQek6uLvgyTt9P+0hOoaGX7ArRsDb2J//yc1PPPTIXskq61DJxReltHoSa\noH6PQ6KACxPH+ysTAY6B0EkQLASYDAyNWn69VY3pvTc0bqtcwyZUcpZZXo1Z\nN7LdQDSi+9rsL8zs9zw23J3XYURfU+GxGmPO92cjmPVcecMfhbCEBJidV8A1\nuGWitU9qw1KzYBQSPwXWOD2PiBRRvl6HK4bt4e91ezJJL8xc8Ed6BN8vItH0\ncxcQeQp8nL5b9TZYqCKZr8ENBJifhyKXeVfMSxrE+dUitTXGAbA9l+gO9ITO\nWB2YEMV/Ol5A4YVJESQMlrOkH6kBoK06AGfqz4QDvhvgnTM6kPWbjl3TDi4V\nIPVV\r\n=Rq7r\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC3bfRN/0AFRCLUFsJMm+bI0tUK7RdLyyUlohlnfg4lYQIhAPjTdQTnQpVtCCBzzcWbcAtG5bADmwje5CAA8OiK96hF"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.58_1572306175338_0.0751039064521537"},"_hasShrinkwrap":false},"0.7.59":{"name":"@react-ssr/nestjs-express","version":"0.7.59","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.59","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"de638ff505df35c94aa85f7a22892d2503a5eb5d","_id":"@react-ssr/nestjs-express@0.7.59","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GvBYJcCZK6e42DWdDF1pFXULfktU/u6mX02pLgQvQOvPDC6h06anAJ46u06e557oB2hAfOE72wZFIVlM/C8GIw==","shasum":"c53dec8bcc7c4b7a9b2181fe7cef787767ca59fb","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.59.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt36GCRA9TVsSAnZWagAAWCUP/2KbstPz1phAzvkmzP2v\nPe6DeZhTOMrkxFAoeMgvLZto3tjrrSPsRPCZaAmhiE1pz8nbeRh/Xd+gyO0v\nbS0sIXb2dCpue1QPgnr1xPIPEhYqW9FA4UY+6V69WSosYaO2wMolmKZsD6dR\nAkcD+GvSoDRtAnza9x5JPqPCzhKjhduTYDSFm2cq8RfPmjKJv2tUFZXydjtc\nSP4EW29rBqf+FTK57KdXvpX4M4DiL+H9n243bFDdP6xEiRYo5JTmjDniE0Zo\nZLyOmhylv0AZAOuIWsOIfK9wfLsdh+Chtfs04/BR+EqvMfnel1EXooqwViHW\n3NUYi8qL7qUdun16Ntsw7rLo6C/3R6nIEsIfqKGMxq1rJy+NP8Tpw7Fg9Pi4\n70u7kPPEKNpx42bZBdhMAZMQ1U+/EgVXeYSgu2vr3i4gIUaBA0iioZq58UCR\n4tFbZIFL0c8+NTalGiyn1QFg82+QwQU5zjisCVFcDty8CzQcIMDES2UBYeFY\n10dAXudCdzzBzAl5AbNcwuMcZpBw0w9+x4wfR3Z7TB26/BOtsqjTtkxh6IrL\ns4yeHZMe8l658E816NrAOTSLybNBXcOr0IbQOqBVLL8L+zO1Zzn6qUJQKbQU\nSSBv/sCguzEkZtnoA268Ll0RB6RxheAd0kUKQ6xgCrEOUn9tBqfPuLOAGJ4v\njB0c\r\n=8GsU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCO0stBdArt9xcFveNT3MJrw6ZsIZSW06XJMNXQp1HjegIhAJjJXdPUgXe8xpYp2/9+ebA8fu1n4gdVu6e7xsn+KvHX"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.59_1572306566174_0.8648616724199902"},"_hasShrinkwrap":false},"0.7.60":{"name":"@react-ssr/nestjs-express","version":"0.7.60","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.60","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4eeea2809b6b7e45a8c6d622b228af61bccab272","_id":"@react-ssr/nestjs-express@0.7.60","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ACmqes/R4JOiq771lCuPXOPcIPTkeFZg2PfpR96d6kyjIfJ6LZit1oXy92DSARX/DAP4a+TOotzsrlHryQ0QeQ==","shasum":"a72473afd21d08d63c1c29fd40992c789a1906a2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.60.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt3+kCRA9TVsSAnZWagAA4jUP/0StfLG3xsNpQ/nGLnyc\nD0kCrxkqfouQMDFdKJR1EtQjtmzVDabsj/za7xb8T08leQQR9imgYeazwSVY\nYRCUuEpfi3Z9lFlA5wF1VIBlWuBwhzyUqI6MGykG5ObGz8TNtqJOZHh91ca0\nAprGvf5QvZ5dObsVJjCZQJWHGHTcP7vvV17QsXXRiiKBwCZYaSLm++8o3RNN\nUGaj329topvGr5uWDduG15Gge3aD9ccJwQYkxhB9FOhBmLjIBdpDhkAlthPT\n1J9ID30AEmYEf2BBzQZH28O6c4K5eGqgVHgFvtlWnxf2ZIkHssVfDbYc+jfX\n3VMEIJ8KYwOnyMhiZchtsURPGnvzOrHc0PmaZERtCVVoqF4ATWns6GRmPJsf\n3YL8dtgTI8FQH5Rq3vz5CwFY/FM5QRWwhjrPF25luJnCrCiBar+VKoa+aX0n\nrTcQK+3aVVLPGt1MiIu0A3ev+Pt368ilR7Dz91FUynwb0VpXmGg7yAHmmnJG\nKcAj5kC5Isb11okwcWFt24k5w1BvEk8O9aXRJqDEw1jFXDLy4fKr3xPKCS1/\nesneR+RSpc1IKZOl4kKA8Tm0Na9LTNfGbmjfn0rzTWhRz8sWcrFo1R+URvIs\ntUHWBcipSpQEYeyW/D2rJmSVVrNhlvD4c+9l+6hYmeqdAmJmUgQMaZdwHBZ2\nE6P6\r\n=O1q8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDQJwwJb/EiOzDbNHHchetD+LKi9L+rM7IeA4PMOO+mWAiEAjPd7ETOPpCjINxsdEUy6VJEQob6aujPL8I9aFWDy8JU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.60_1572306851964_0.8170916932787364"},"_hasShrinkwrap":false},"0.7.61":{"name":"@react-ssr/nestjs-express","version":"0.7.61","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.61","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"da2338c8fc749a8da8ccdfb7395b844b89f3fe84","_id":"@react-ssr/nestjs-express@0.7.61","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-lTi+if4iz2EarQkb6S0YH5Gv0t0lQFzj1feI1Czk6iMa5GtfzJPiGZ8xVN7vZYOVckBaLUTvGEkgjWrCtqapdA==","shasum":"917e51e9ef79aa24443069ff737321569167e1f9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.61.tgz","fileCount":11,"unpackedSize":18312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt4J2CRA9TVsSAnZWagAApb8QAIuZsgdONEKIqCPrNAiB\nRP9LAu6cLSGUiyTPs+ijXuPE1tZUgs3i/8yisRFRz78ob5lyjiRPOMwyjiaJ\niJdJmoht2xKN99OEnv+JdDM2Q4AiWzTZ40zQAmfbHCp1EOPeH7ucnyaIIAFO\nUsTISS4C8vg/6s5AuK/7BBMzjmvVCMDv02yrhzaH3XWvLxfs/S8l5igmApRY\nSTHWWoELD3IPvzGiNe8+CkzwlRjs4UcCH0iFKo+KCXqcuUKtjWkMTI5/YEs6\nVYcP0rNVum2B7kro5MI0lDQ2iSOTBgJQAekB9LmosiElbsHBoiIrJX8EfwsQ\nYAhkDJh/fzK7aSe5QPiCvuqYR/p4tQ16wtfv8WKleZMY597MPbpE4iUjqSAO\ngoN7qjaD6dflrgr3WA/OoVX/+UOEsHutbLW1OI30Duec3tH1DwXpQrAxQTmh\n/6P/9voFioef4NuXO0XmXcSCdutpFKq27saHrR+3u7k62yOoRfrSUa8dbG62\nzWhdmkfw6uZ/4GlegMZN0VZDk+/GcYPXu9Oz8zwVF68SLuEh9EEFBxaqkZdW\n3TZE72rGHm0/f5V4mHwSrVk8F85tsJfRCJ+ubV/wbEnub/jYibRWobRs4hCc\nnZ1PCbWEvoYPoT8BgHPmXZaAVFxAkbnobeu+N5ShbqzahfTk65x/AOM6OgF/\nEsoR\r\n=OnaG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCby8CspRbjOMV9XUkCzXdBadSsRZDyD2dUkQAF/SRzjwIhAOeqOcTnuPYfaUFQV/OJLXqXzF5488G3x/kf0pdROohV"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.61_1572307573936_0.6596898665086526"},"_hasShrinkwrap":false},"0.7.62":{"name":"@react-ssr/nestjs-express","version":"0.7.62","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.62","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8c792205696a595dcfc95fd2811377c416bc1640","_id":"@react-ssr/nestjs-express@0.7.62","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-vhQnKslk1hu0u8WDCgDLLR5/qp/2Bl6Oj2E+rXObdvMeYbfTCGzbkqKHWCef89CLFatp7LdAqp2CKZjyjh8qJQ==","shasum":"810346ab394a8ed30714636a070089a8d9a01ac2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.62.tgz","fileCount":11,"unpackedSize":18294,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt7wcCRA9TVsSAnZWagAAC+cP/0jmLrRF0h6SssX4KfqD\nGT76LWJN9Kty2/xs+ss01ruXq82ogxsGhm4iUmcLZYtGKku/i8HyuAzaS++5\n5Ken+YhWzCC3lncSjWvtroFs1YWbjqHi71uxShWskfJ5BsE353R7+QzAZfL+\nN+O4mMAOScGwEUGfDYWFNbzJ/JerxloWc65kwSfbEupTOQT5xodr2iepmsLq\nWbxDy68q7yicbFUWiSy1P8t5SKdw4BjBVl7GRTcLQFuqAf8ckXlq9qOlclr7\n7EUwm+U2aTtJYxr0ljk4H3AGkBCUR/OmQIOuzkAFn4aXSUnC8YonceP2eypp\nAYWKZU/9/W4FRct49E5N3aa+GnWzp+ES1vPbss9yNoM5kqaxoNBINd4BfH8I\n4gvoB+Z7ZqRPkAq2OZvBLCWEz+tkrvXFYiFyXlf2VP3Iskuzx1AWlZ8R7KpA\nAzGThaVSjw/jq+QJp6rj5FG0FGFnp1QgpJ2NEBqCcHGoP+8IPvYEWppgND9T\nJ1hS6fB10egA3FGxPSXiSmO6kZsYN3qUz+bflSu84xRV+hvJAOUjYwsy7oQT\nWuymhZzWqn12K1wfCDxVZ9xmvLPJKHju2Y8sfXinQ1Ej5sM28tPCCuP/BtVP\nLwWi/yAICX3wIEKJGZ3fJ3rDSMjOxni75eLa7TcEnpb+3ED0XrouNrD8JJ8k\ngQC5\r\n=xr3T\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC0ZYz9tr3AdWVKFH2aGHrdvIauff3PPHqiRe3wqUfs7QIhAKc6TVUfW+jLF7mst+1sL1Y0SEWeTTcNhYZS0UMFAqWS"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.62_1572322332130_0.5622035935401337"},"_hasShrinkwrap":false},"0.7.65":{"name":"@react-ssr/nestjs-express","version":"0.7.65","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.62","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cc197eaff3a99eac2b6b552b0a29368c339550a3","_id":"@react-ssr/nestjs-express@0.7.65","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-qyij9sHFduERAKJ+nkXk2IyQO9Ds1huLmuo4m8+pROXTPZk2AmmOM6ddAaW01DwVqyfYQq5t/YnjpZKWWirHRQ==","shasum":"f01025641f288ba2574191da6e14cc3e6220aa26","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.65.tgz","fileCount":11,"unpackedSize":18396,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt8tOCRA9TVsSAnZWagAATl4P/1V45fc60LNRgycRxAF2\nS9pW/0IBVkCQIftbNS3oP6D9wO1pjdbB5f6Jfa8JoDzo1jXr55UjxUOHriop\nSuCbGPz9gIxpzjIG/dveghzcbizvwHjwcWjW6PTik4yK+jokOSqYQv57j1vX\nTUChc+XVJCMDpWpMNg2ykPGRAuT1VWq0iZBKQbPeLfDJE1H7If35UzF7SBj3\nP75c5+6h5w1SEVzNl0rBSl27cNbokc5wCnl8gpyB7kh9yA7tJl3ItGivxy0G\nYV/xr8uYZgjhF4oUdQOdJoj0dUEaWYhTPn1nUAm/6/+zBUxP1Uypkg3UAfdL\nZfYXivpcR60GXTep3VeuQfi88yjGp0RUH7hGJFW4WQLM4jZcoVgrMkKdlVzV\nN885ZbmQjw5HqCFYaYqieD+HGuvZ8ZM4/woVcPIYoVzifpAMdf8nM8jm3JlS\nfKgqbq0TNZ9Bc0f4h6UyFUiYQ0+f1yEi6SDw/74Il1IpKKVzXm0ZmWGpceH1\n8jDKKiOVf8TavlPNVO+3u/iO6KGp9oJTpaYpsyMBlnh18rzP59QnkA74y19v\n4HZIbMb0sdbUHkros6+1bDrjB3B9fKVT5L/A9f1P8wi7ap4L6O9+K4AQ9yBH\nniI6CDQsss56LWxH+chpm5OgWFpPw/yP8Iu5yl51ftYJ3XkNXaiMOkr3EZfi\nrb2f\r\n=eIOC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDdkD+MHqCWBG0g9TgHoE2Ze9jAWmj/vXFjNh4eHSLhHgIhANdjSupcHWHBvmwQTRl+ov4xwF2ZzUbDDXckhy13XegX"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.65_1572326222241_0.21654996399889437"},"_hasShrinkwrap":false},"0.7.66":{"name":"@react-ssr/nestjs-express","version":"0.7.66","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.62","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"758eb037b4f07a8e207888524b13ccf354f71b37","_id":"@react-ssr/nestjs-express@0.7.66","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-tMO+jWhOnm2nnIpJcvsPgodE1ilEMSo/4rKOWaLyQkKF90cx1RCzmpUaE40Tb0Nb+KYo+TTU7TBFywHhjYhrHw==","shasum":"fadd0c9b0e42851a1131d4e946797f7d7488942f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.66.tgz","fileCount":11,"unpackedSize":18373,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt8vMCRA9TVsSAnZWagAAaCMP/2y5WQZPodDYvwkVnLSX\ndPokK0+p297Trw9p47O4DyMTshu5a5xGI1cwZ7SrkQWVLAVQtdY8ITY7vV8r\np9Mwg6EQWMlWDn8XWIJ+RBQhETGcnOK43gOFRDV199VQYXGBCuVnvGUKYZ+4\nCZObEVdyyhcaPBmUAk3kdGY3Rfp6wbdM2ADN6jYLBAos7tyBICYwVkC2xbBH\npwYkwWL4ajS3i1ZXx/CmxsXGoI2IpIgcKzQghbjx/5ekYMoK4ji7Wz8R6Ewr\nWu2PANhmQgcVygIYxB0otZVbLXCf2ImszFsDQyhHo5ZBNsGzFepFAUyZ4yGP\n3MOzMQKu3wYbi0veUFux5MgXRQ4uBTCebdtajMNSpKEWxSZt45tbKC8IrnEl\nFALteRkVlbbbPaeqRmVVu44mSHPHnwdimre/ftRjFqOf3lBn2W5ZsiyRAU7T\nL2a2z6qaqzLXfVQyUB5d5bP9yjvkrnFEUJUUuexU2R82JdxhlPSEtX5cYk93\niefm0643SLig4k3V167H7uUGK3v7Cye+DSJw7uXUfvN2F6YSkwJwnIbvyNZu\nDxVUvlTVBK81s+8UECIdrYwPEVfDc8ABrl29L1V8JlbBEYbpuM/BOF0FCRtC\nWIuknu7lGLKF7YgSiOCeXpWW5sHiZhYQ+dRpYQ453p4yQJcAZhOHLPMeCMqX\ntu0b\r\n=/ASI\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC1nG6+0B/8+/0npJH0dLUnlu88PbtVp4E8Bi88FjCFCQIhAOoTu2FusfVEMkYo/eg301MM15jAa4CVwMDTP67ixM/P"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.66_1572326347517_0.6897546010725817"},"_hasShrinkwrap":false},"0.7.67":{"name":"@react-ssr/nestjs-express","version":"0.7.67","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.62","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"09820a29298822170cfdc7a4509320946773f39d","_id":"@react-ssr/nestjs-express@0.7.67","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-MMCSBdPRU9SnY4u3v9dLn3YCpU7zC/eWVPpW6CHgp1zU7vH+zh4VJrsIYMy6gJog6QhFPpAZz+2/ZG3v7a757w==","shasum":"de755f4821a2a6c0431a835d82cfcad3a64a35f2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.67.tgz","fileCount":11,"unpackedSize":18349,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt8wPCRA9TVsSAnZWagAAVTAQAJMHjuqUBYCVmykNcn90\nKiK5ytFqAwOptFda03gX47wANV0xkWtBatswzazx3BwL0h+o3lU0KxTN1LA3\n15N6ZATLjE8qqIgUe3qO4ESk7GgBUNXswmK70BEDQxyJl9Rm+cCvoRjt8Kc8\nDLYMwZ/IJt9jKvHf2vTeOCJ7vV/QgW/IMSV8W+C0OxVNXFiqXJaDvRxoLsBj\n+mFQcNiW8RuNy6Hh4XGwWV+2VJhIEC8jcsf2ANiJS80S42vsTNXkuY48KApc\nINPlB8owLX2JiJt5a1uH/OEsTbzEK1WhqswBm6aooLOrEsGesw++c6XUvjHv\nRWks65/MgxMpyAhkh87zsgcrw4TAwRHvYiRxIg2Sop8PreIwpzKK1GK8Bc82\nzD1lQCj+ywfrzQpRSbWMbcNaN2CNP4DZxiQ3pVzvJbrMDNocDvfvwXHsdH/b\nDL/qPAEPPGlGNsIhEMgGwRiU+9kVv/fFyXN5FLnEqX8m2YDfEh1scsQlx0yS\nFaIQGzzwUk5sedNAFAa8P2Trv527oVE/spwmdhvNtdS6z6LTqx48wNwpUrt5\nA79jqYx59hfAzzReGQE0txQzyEPd0HFnGMRWTANZ0qbMJR6KoxxGVWrtqNBu\n11LExE/EpbY8yj21dpnD5Duy8BhmGz0yikD5CFMfMaIANK5f2swvLu39XMQy\nvDAW\r\n=UK7U\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGzlSUJyocxyEQQotGbFh0Ktem3lt7XCpXpHWdQ7cLHFAiEAiVYRwN7Xj68MhN+mXHbRlhnI0wcma1/HQQo596b/U24="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.67_1572326415247_0.08161535415529353"},"_hasShrinkwrap":false},"0.7.68":{"name":"@react-ssr/nestjs-express","version":"0.7.68","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.68","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8d9640d80e5b848ce1b1677ba81890c1a29f2992","_id":"@react-ssr/nestjs-express@0.7.68","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-6A9G6kWpNsrJX601m2H9i7WSZKYqeAw90qmBsxGEX9HYUAMcAQblnaIaI1AcZFseOP5nVMTWJyeq+4zcJOES/w==","shasum":"b373dc7ea63d602077458d6a676d8ca1e9e2d3bf","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.68.tgz","fileCount":11,"unpackedSize":18349,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt80MCRA9TVsSAnZWagAAyvAP/1Bg4H+8LfalHr6dhQ+l\nSEg0WSz6+3CEn92uugMmSN5FjNGNNios4IkLf4btrifUSTPTBPkwIs/mPQRM\nH0eqPqnpF3ALbeGJoF084J4ztl6vdpJ92X49b8CNc5ZUaevk4+KQhXep/224\nPu+vGjYnWtwWVCVgG/CGfrDoO4Ts6jNNizNQbxC+CCd6EfZ0imA8b5LvK2k5\nWva5faC6BcE3UULQ5+NFy0yeqA8Zqdz1cN32pXWYeSXkpzCTlI22LneRDC0I\nKyBDYGfbtKZFGAjQ5Ljk69yb7yAT9CuNTpyuDCO4Uee6nKet52oP0VqW2mYK\n7pE09q5ipU25TNlRzCKv+CbgdpdOyaKGjB74zUHsB1CXsu2EIAd8theennoX\npOS/09nnyqjnogdfCiuEJGshRddP5ngSCMYcw2U+E76vVcvqwjyP2zJvNYMI\nBwv+VW5uOyWJoqHhBmKju8NS6heXExbXt2N343CL22tTb/4LGdtThIXXroO8\nlb9Ri92W+xAfauVZz3F1utzVwXKMJ/K/darBfsZvHja03tLQuX5JK9jm98My\nY+5yDNtWRjAyvyMe/gpgZBEpNu2tyIrMs43HlUUR/joJqcxZeE9dIPESba4r\nYKjAejiLi7p7y+B18LjutTwEcxl2Mqmr5F0stgRHK/044imVtTYqfU5ODqku\ncbxZ\r\n=Z1Yz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDDl74Reif86+3LVpjRzRvPgrVHQZGlMZJH9lFe9AJ+bAIgCnpiOBlXeN/DCpmsC8hWKsF+XBh8bvwJgdQlSHdZrng="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.68_1572326667972_0.5981263763672173"},"_hasShrinkwrap":false},"0.7.69":{"name":"@react-ssr/nestjs-express","version":"0.7.69","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.7.69","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cb1228d2f63397f9c05fcd02c83bd7a78fe7b8be","_id":"@react-ssr/nestjs-express@0.7.69","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-K2L+GduV+me4kBBsxp5fIVu6tdLNlgijkaPpyiNm7PJK5h2jiJcpZwEJ6xCGFrkOHMRR4p9g2bKJ6tLWghoqBQ==","shasum":"ba2f1308dae08136856915fa757ebf19c25c80f1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.7.69.tgz","fileCount":11,"unpackedSize":18349,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt874CRA9TVsSAnZWagAAV+EP/RB5iXkM9tmxx4MwcFqj\nSs5UDdNsotl/W2/8pYfqM7j4+3FLqqO8ZPTNzhZ5hj93egW+oVXOPEojHT03\n9wLrZP3ZsQUeA/4t/XRJscvPqlTWjFnJ0igHjqueFiJbKU5Ludv9rvCjkCYb\nGwyg8idUgAj4eFFJvvvYRUNCDw0MeeoKs5zgh5WGjsYWq6sNLRk+1vXSkbYF\nUkyWsUT6/ZfSE77Jhhni0gjzsf0pXjXWDv0GfiG+/g0G9geSH3OPrdbFdenX\nzsviTRQtbtW3o4st4EiZ/QwvdgWiYvAKoKqhjzTMCRyaJXgqhxdigqwTV/Qw\n9c04PjcNqo0K2adlrpIms5gdV9tUNkugFFFf8fxdn8v8MD+1a06/ntkq5JJP\ntZi4wfZVodjkFIcNA6TCG0zveVeuumqmG8mVaAU6o3OXoy8Be9VzKfjC4x1H\n3YNT+A/YZdnKVlbuORMTspjefFPeppmWGvAG66TEUpXWZh2IJtghfhFQYnem\n4S3/lt+iUSiLYvTbh67V7Sk+nr4XYkEUADGBVON75b1U5SeCunm3GC37dT3m\nAxTmz5sJb1KeJ0+kZPnmDUyhkeZBpH6PhiHeZL8I+E38nVYjD6OQ18U7dRf5\nKXC9G6sPrlWWEJXJO6reNJCBY3QdL6UtBY2lLFD7IHobbWSXJvqdiQPIIjsx\nbRDB\r\n=UlaF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCW3HJcmRhE2302fTQ8Mtq41WQ4rqm2yTjCzrVuc38rcwIhAMKu0nOuMaUanUCrJQHxS2qibVeKqRq/D7B15MyXg/Gc"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.7.69_1572327160357_0.008954032785454258"},"_hasShrinkwrap":false},"0.8.0":{"name":"@react-ssr/nestjs-express","version":"0.8.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","scripts":{"build":"rimraf dist && rollup -c","prepublishOnly":"cross-env NODE_ENV=production npm run build"},"dependencies":{"@react-ssr/core":"^0.8.0","chokidar":"^3.2.2","fs-extra":"^8.1.0","json-url":"^2.4.2","lodash.escaperegexp":"^4.1.2","memory-fs":"^0.5.0","reload":"^3.0.3","unionfs":"^4.2.0","webpack":"^4.41.2"},"devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/plugin-proposal-object-rest-spread":"^7.6.2","@babel/preset-typescript":"^7.6.0","@nestjs/common":"^6.8.3","@nestjs/core":"^6.8.3","@nestjs/platform-express":"^6.8.3","@types/fs-extra":"^8.0.1","@types/memory-fs":"^0.3.2","@types/node":"^12.11.6","@types/webpack":"^4.39.5","cross-env":"^6.0.3","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rimraf":"^3.0.0","rollup":"^1.25.2","rollup-plugin-auto-external":"^2.0.0","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-terser":"^5.1.2","rxjs":"^6.5.3","typescript":"^3.6.4"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"25ddbbdc5b82a005bd2896073b8b320e83cab3ff","_id":"@react-ssr/nestjs-express@0.8.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-TLtQtJ80uuFkJOOdNE5Irj+HYLyU4FMGTS7uLT/uORkMg+y+887y3PHuIiKe0kmp2mVlh1pjbDAwgxDwMzsTNA==","shasum":"09e4bf09f9e1c6e5d226088f9380c16ab50ac9ce","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.8.0.tgz","fileCount":11,"unpackedSize":19183,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdt9d5CRA9TVsSAnZWagAA2gcP/3NXNVBwHJpNwcqYuaY4\n0dupNxDnvTT93QMKQ9/KG6s7lQkjvB40BOylYppVcbgnf0d0nB7By12dCW6x\nDHLSChuhqrzC22MhlyLAGhMNpq29A5OEaVaXTpn4qH0orqfKebkjDLDYilfi\nJ6DJ8aDjvWF3Dp1PS3sRsxTZAWyAIA9Fok8D4iWsrEQtkbGPi9eDg6Fr8vKN\n/Sjdeutonz86p/CBOFkIxz3z6esY+j6T0pAxGuiw7yRisRkOO4P2OUh0iMC6\n4Br25xTB2FXeO6Qt+KZ2KwSxZ8OafSiaXuy/d7aD01zyekwb50JTK4uln7HC\nMie1cKTrzNceFfnysxzAeHTz+iDbXAw7NOrBNHHi/7yz9/Rj8R3KA4wxZySY\nD5tBdhxMZjxHuvvdFhXUVa2NDi2vZWchUOUurpBXR4YruDBji0dSOMTNk+Y2\nHVyeYTAt9MvcEue8X4COf/zwfuWDp8gqL5scn9N+XqzMeTcBtDj6r0/Pcdhi\nXpko+6ZEpHnDFtkpivlIm6qFN0q9YxhtrW4Dq8deoKX05OnAcuXBlFOFHEsA\nmfzWrYH0cRbuifCkCxLjVyMU9DbbFJHdvdXvyOynnm8OWK5SpcbwE0VOcFCu\nt4mmoj59UpUKKZUVkmsE7PrHWoJR6Iwu31ywbrxKUQnrSYDWrMitckWZ53Fa\n+G4k\r\n=jv8V\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFNSy/xatDG+Vc+fal8u5WzV7s/IuSEScW8BiM9LNijAAiEA4ScWUEgzBbW005DVLK2scKz6bOoaSsEaivFXPYKXi7M="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.8.0_1572329337413_0.5098999452536195"},"_hasShrinkwrap":false},"0.8.1-alpha.25":{"name":"@react-ssr/nestjs-express","version":"0.8.1-alpha.25","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.8.1-alpha.25+935ca1f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"935ca1feae6c845267d1510589de03f037881372","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration: `ssr.config.js`\n\n```js\n// default config\nmodule.exports = {\n  viewsDir: 'views',\n  distDir: '.ssr', // we should ignore this by .gitignore\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.8.1-alpha.25","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JR6oCWa2W8icNzHlCTXYkdWBPG08hkr8KX4gLXmQkd2/Ip5lM+sPbJO5hxwlNc2ygFISP5+9RLGEM9sgiTz4dw==","shasum":"0858759c88430190d810411c65e3dc55835bbb81","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.8.1-alpha.25.tgz","fileCount":10,"unpackedSize":14176,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu4X6CRA9TVsSAnZWagAA9x4P/isX/63fS64CPGhx/qIn\nzo3/aonLr0qHgQa7J6Ti/Ys+ySdvnMf/ZhPWbRo9VLXr4PQ4/rKsyqsdINMA\nJ82e7BI25AAChfrI3y7DCgmVPLqQ/3cgV2YNGqlRZAcOHcNQIc4Gd+t4PuNe\nlz/dz4SLn8t5JFONY+vR8+XMZMuWeN1UHoNQ/D8MjBqYyydFyyKfrzIF7eSO\nFPX25AaosJ2ovKB+VbGLGfwEYV4LXu4l46UsOq2UcBta+VrlA25nio9x27H8\nacGRHX6IlU18odmHUjNvWfSi6gb/ReGrypAHulK2b2xWxEriZ+eBtw8KauLz\nnuN4pjU1bEukocinFE6ZS4ZxgbsEiyewFaT6PXB2EYr4dgb7uVZ+zmzqp3bS\nIpJqhunqJ13W2SY25ulgphzAzrm8FPdmdpFY7n2lJuZjX+zFd+QbZXAbcuBb\ni9QUkKrBNE+cuhG1YyG+9Yyj2zkfJ57SRhSnFe35Hi3JFZMbYVzjNoQ1XKGQ\n8pDC+McO5Vb4ZCOhK5YDls1XwvESXOmmqY+h3n5ecuJndEiJWXeLzYVZRyuH\n3tJkIkkn5M7IY+zFemhMo9iSoZ1po7hfWHLPlYTml0bg3lu86kAQXqW2g/mP\nWu/bYDbEiNjrC+TYqkQ/cQ7BjIPV4ZkO8SDZZJHc3OSMhb7pK4/nkDC0uEqe\ngfkq\r\n=U9R6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDDKmAWlFyR/ga5dQIb7ZDNyWASJaQoMn2WCo/yRQu1iAiEAhYpKTrpt9Q4+QG1nqyzFTo2vMrKUONou3oeDmyPyKYY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.8.1-alpha.25_1572570617920_0.9137052447488949"},"_hasShrinkwrap":false},"0.8.1-alpha.26":{"name":"@react-ssr/nestjs-express","version":"0.8.1-alpha.26","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.8.1-alpha.26+e4ee4af"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e4ee4afc8707e4579d822dbe7d69209874d82e52","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration: `ssr.config.js`\n\n```js\n// default config\nmodule.exports = {\n  viewsDir: 'views',\n  distDir: '.ssr', // we should ignore this by .gitignore\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.8.1-alpha.26","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-UK+OZoWmu818cAgTzLdiDlC3X0BVmXHT5Iw81Cy8fW9IiN843lqK/59NhZppAnh/WaTcLM5QlUHGU0C2r/aHpw==","shasum":"ecc0823940d27cc371f47a34f5ce2842448eb1c1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.8.1-alpha.26.tgz","fileCount":10,"unpackedSize":14176,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu4d1CRA9TVsSAnZWagAAQ/QP/1pXi5ets/A+M+r/ZtnC\nUjfDr5sLcBzPieb9hmtIta57sicJuAg9V9BY2hbLwjFCubPXNo4q6mcGRPSP\nufNipK1+WcUA3vu9A2bqLVjih8SnGDyTNzx2OhTEuqsh0PvFgnSonT4QZ7mS\nXWMjopF5olTvBlQck6QgMjkd7AK6kcBr1QYpfU4zbVn3xU619nplILHUSrrg\nCbdlKF8gBr7J8xGQEEPMh5gGI2BNr85JAC7Sjebt64mcV4uaoTnGjLyQ1G4W\nOBAAOGz3aCFQM2eEGTxDU2PTkzOBaDyjvLgLA93X+cjS5tgByptAD7Qyk2xX\nx5d2sBVCMmu9old2qa/uk6DWQIkgdfNopJkVTrSMQINiHx4+C+SvTJ77FF4T\nexHSU9wdfb+AYzJIa4nGKyHB0ysIySBTlFKCnLrwJ6T4eIT2RQ9RwIKEyrBF\nZzEY8888jjlg9k5/2vf6meml2KE3liuWramFtRt0vjWEfQeG96w+FYQ8kj9+\n+3HfbteRWS/tGJTAq7ad1BpIbcJcsFBsh00LF3M6FYj1Q0zZlXLZM3olKwti\nrg/MaaTIN0zW/1U4jBISOp/tHEzFb/x3+lc2gL3/PDTxyur50hsKi3FWs7ju\noXqsDnOn6G+XHsmUNP9tumiUHUc9UKOpVSweFQtgahttf52gqxle3VjJgIBr\nKcGD\r\n=mzyN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAR44cFch0zhmmDeNU/YTkiPeh+WqhR2QA1Epy5qcaECAiBkjkEwVoM8j4BfqYD2cNjjUCn75TRwhu08epzSxCoPGg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.8.1-alpha.26_1572570997444_0.8986522078520174"},"_hasShrinkwrap":false},"0.8.1-alpha.27":{"name":"@react-ssr/nestjs-express","version":"0.8.1-alpha.27","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.8.1-alpha.27+69401c3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"69401c34a7670c6cb9cc411da9ca3255edae6468","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration: `ssr.config.js`\n\n```js\n// default config\nmodule.exports = {\n  viewsDir: 'views',\n  distDir: '.ssr', // we should ignore this by .gitignore\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.8.1-alpha.27","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-jjQSlwvH/hWBo7yQo2vo8NypIii5SAFoLYptns7deudyLQUgWzQI4tmOgX+rz21481TkAMOcfsicbjRhoOn5Ug==","shasum":"7f5acc383546c2c60e5719c5a9ac2a47ffbe70f2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.8.1-alpha.27.tgz","fileCount":10,"unpackedSize":14176,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu4jFCRA9TVsSAnZWagAAoFwP/2kipsQ9BeEIM855dFEe\nnhSuZTBqIxNX2ERWxcDogd1OiOMxVR1YSdR0VXskwMgMq5e70bn9QGyaVxrP\nO+o4icokTBpWzJQH9RaiKdgtQIJwD6zoY0xyOg4IUSqnisy0sLYVdwIm+6lF\n4rxVWiLkJJlj8EW+j5GYskfxeqcHvIYRKUuXow6ytEEPpDF5yKiTadeCIzhW\nVtFfsQCfVIu0P0Zbq1M0ElGPC11Bs/fceyeidSwKoDEIUHk6Vl4LeeDARtnA\n1Mw26uhPMFsaB27lS/gtR1U+Eyg5E9g4Ory7dykutJjLnGxtkLIp7S3wIQ9r\nTJ/vMTFx259ncs27nodkVFbJTs1X18C2ltNQlbUWRjYh5eAbNZx1auWWwDV7\nzzS7lA5Pti9B/vDvmsm7LF/sLn8J8+As+Oq++loQYvSuPmCXGgPNh3033VAm\npQBZ0amUijlQvtiaPj4v82H2RORyNYG4j6VxKsNfP9rxT5S99Q/5H8wNMJ19\nI9pTaNkOa6adN/rHk3h/Zo2rxuhMLTVWRXRIRc2DpiGoDvPelzRXv1UusQGq\n143DOkDKmCW5B1EzBRxH66CqzT9/k6OyJUUTYIOi9dZoTQPQBUCRzNvE35d4\nyQT2yEzf5KBbTlM9RfRYZ9olYhLp3CoDa0ZkFhfiAfZigLMgk9yqXlZ/g9+E\nBHgt\r\n=B1UV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDdDFPaNmqdQ4GClBsn+hpsUg4LOfOlZWq9FtyeHylbmgIhAIH1kaK+Q2/kjTmYhcu04LiPe7EIaEluX6kgYxK7hwrK"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.8.1-alpha.27_1572571332786_0.5058746599744346"},"_hasShrinkwrap":false},"0.8.1-alpha.28":{"name":"@react-ssr/nestjs-express","version":"0.8.1-alpha.28","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.8.1-alpha.28+7ab9fb6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7ab9fb6a3ba099190bc809d1a49fd5d3c9be1c02","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration: `ssr.config.js`\n\n```js\n// default config\nmodule.exports = {\n  viewsDir: 'views',\n  distDir: '.ssr', // we should ignore this by .gitignore\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.8.1-alpha.28","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JsuaOItl8xzTABhx6u3DmTdQdZxluSotWBxttmurRgCleU0nVOCrwUhUgNMfMxWPtwGVQLx2YwySjCo7gFWerA==","shasum":"c38b85e00a95235a37e68de56d143ad2f15c4009","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.8.1-alpha.28.tgz","fileCount":10,"unpackedSize":14176,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu4l7CRA9TVsSAnZWagAA27UP/A5CFTdMuxuua7cz4jJ5\ngGltisqRdwsuz08epk7Ygwl7YZ5e7ONdMkNFFxbwUXo2Xq4hUEQfVpD9smoI\nLIE6TQbLV4q9uTXEnXBJr0daLXbKCMKLnBDVbUT322yi3TVAl8Amdq0f3N2F\ns1T1/0Co+RwNxXs2SXJCkl+5SLEHbwiM/BaIvbSG3ISvEMQWRhnEWzO29HTP\nn/aSoVTPuHo+/SULYhQkX5Olf0PKBqi8v0IDbpFb0XNQfRmA2OhLltm4/ZXv\nhpTujbvlK/kEOI8sggoCjNojKmRbkRpNRIe6ZYy8rDnJrvF5bRE/VcOxePTa\nzQFNgHAI4CfBmjA++q2V5JUYNGFqJEiay1PFhIdLBE2eEtaCt1yTNqwgSJXB\nfxCLvfmWq55krT1EoC2RoJq2c7V+ZNVR3gNvmTRgI3c2LKFpw2dOeoWffKqp\nX9Qrqel7G+PJw0I5XDew+TtHDYLdoqSs7dV7NRr/09V2wlddpQUPQQAQWqIR\n5G10wKXSjrKCpGWRORz/oC3G0ppGYdNXlfVJLUu4FYMTHIXW71BXq+nvj8yy\nXMuD2L3F3b2zzU2mk8vdiLyoxkhizqOfxFM25IioYOFJcq57BdDKxoaLkwLU\npmkNJLQy7U07wB9RQeYWMbvunbKq4tOI9xKBZvrT+qWDGE6xyDIRGFGfvAWf\nB0yZ\r\n=zFwY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDoBeGRoO+8BVLQeEtLRjNltGIGLyCC/ytAwJeVy7tNpQIhANA8ES+Q5kOpHPMw+kUv/dODvonwfN5GztVhu1FMPmpK"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.8.1-alpha.28_1572571514896_0.01708609382831372"},"_hasShrinkwrap":false},"0.8.1-alpha.29":{"name":"@react-ssr/nestjs-express","version":"0.8.1-alpha.29","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.8.1-alpha.29+b72bc43"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b72bc43b0a0e9d2cd149096bf3cc6dd4320d8844","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration: `ssr.config.js`\n\n```js\n// default config\nmodule.exports = {\n  viewsDir: 'views',\n  distDir: '.ssr', // we should ignore this by .gitignore\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.8.1-alpha.29","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4oLxcAIdPaxH89M/H3dYXLrDeKQGYBaN1iXwR0QUsl25h6MYKFB0Wt6DvtjrEy78WseVqke3gwTOvbxDo1X5Sg==","shasum":"90a9d94f4792721bec06c4aa13044b6777635cf3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.8.1-alpha.29.tgz","fileCount":10,"unpackedSize":14176,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu4pjCRA9TVsSAnZWagAAkBoP/icQfGMhVSIX6SZ7UMMC\nZ/6f7S65D5RqhU2HglRIkJicEdBm7Oy62k8sGxe9liVxv/8g31bwiaFLN4Ot\nbTvflxlOjeSNZKSGmYUfDe+EhkTLwS9NJ0/3M1T4a/bNbtucWf8Ugp+boMCc\n8nVaPlY6V2+rB7aEEUi506Gz7j9VH+cgP6LxiwFui/JBoJ64qiDFfT3HK9Vq\n7ElqXOFdy9GatV5GC/pdZcJG2x4iqTPLmm8tQDK4xIEPtcpGhp/Full+OS5v\nvqM3MH2yeZY5ULJRmZqGTI2t2x4Mf59Kzez40gco4HoMH4pjvCIVrsVTjT2+\nslDIOvah+1zUT5CHn9kFQTd2ur7Ae7oZWT7yUJHoBkt8UdoqH1QPsmeiLArg\n3frKIee6+YnA9Vbm7yoxt0qpFHDemBlvCSwQWsXVYYQnLd3zm1qX1w4kZhs+\n/y4cmVwbU36LwjXnWEILp8v3Z5p8nr5miEtPj90Ygnv8ok4BdxaVp640TLss\nVWrwxjpbzMM+ReHT6MgZiVnc+xWGarWU4Q7CvmvLkKPEvRR/civJ5iYry7dL\nJDDojz7i436ghLEh3xzDqkBZIxNpYUg/OiT1ZWukg26a0G2rN5+yhdTxMhAc\nlyyXwxTn6a6SedvQ5bXSbDUGCa+hJw91f7tYw7jlRGCdXZSfBa8/rVt/8iFn\ngXUM\r\n=4l7T\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDIH+i3KAYju1ZQBMW3cGmtbwbyV0QDOQ3g7KDUHtZzfgIhAM4oeX0sM2DRTRNRypnCjJJ3GQBotjiyw4eyZSbnwxpv"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.8.1-alpha.29_1572571746932_0.5335610432322178"},"_hasShrinkwrap":false},"0.8.1-alpha.30":{"name":"@react-ssr/nestjs-express","version":"0.8.1-alpha.30","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.8.1-alpha.30+cccf08a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cccf08a80d3dc29f7064d118f2999e74921fde23","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Features\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Hot relaoding when `process.env.NODE_ENV !== 'production'`\n- TypeScript support\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nand add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // enable `.tsx` view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nand then just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration: `ssr.config.js`\n\n```js\n// default config\nmodule.exports = {\n  viewsDir: 'views',\n  distDir: '.ssr', // we should ignore this by .gitignore\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## How it works\n\nWIP\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.8.1-alpha.30","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Z7Q4RP6d2DaxdWtmaHp/nE/M0QdSgvlQ03B5Eot50QdxlA/DaGTpzZKiU19/3oxVp9hZytIEKNQy/63vyMaZew==","shasum":"94b74e12781f5f4dd54e4c009a0a02f4c7ddca7d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.8.1-alpha.30.tgz","fileCount":10,"unpackedSize":14176,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu43aCRA9TVsSAnZWagAA/BUP/j9OwBbt6cCzUD5n6ksV\nUs9runkqCOWOobJfatlnBEd4sXQlkU8GBfHILHSNWgQCx+En5UUbvnvLmt+m\nVtqkUMZAkdA4h0mwt6q6NWEz9Xz4SIUcOS48UzwIErpDonGWFQALVnBdyzUv\nSij0aVq12x1YmvgaRxDjS0xMdgwXVfUy1SAoIwO18v1ATdG3iEPeqa7J8FRU\nNoycGyea08inSXUAX1lwWxyAo2I+b7I7UXS2yYJJwnb2nTOjfeaEoZIaNCvy\nI8xzgAJ77oSimucZjkxGgVnnkb8U1e446xnfd2rGhcx8cAhuX1axdU5TULXj\nU8hMFfrmmQFpThCK0iUEqRPvjkwQ6khaGmH17IcwV9TlMTvdzZK9L/QXg943\nXV7xVAa9MgwKRYjMAqK37P61Xs4ZbZ/VefyvdBtx368vcE4p6nQ++XIVo0zM\n361Wz0B6xDhAAPKBLQ3daWsmDd2vSC59RTUQwBmQa8TPqAJ8Pv+Xk5ZXlSsm\nbApcHOhCwwcttsphR+4W3al59Bs5diN82XmeeuPRyK2rJ9BlqnU8np0n8JnF\nTfQW9Xceu755ShJgI2e7fdSgvIsgDWHNf2sPYL2ymgC1gk15BkOTXMy9XZq3\nDwJUXzSVPXNbj1ItENHdelbei9gvWtnlQ2K0h26WGT4mgo8eNjKJkdFVSIsx\niF5K\r\n=2Y7M\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDGJIXwK4K5cFIJ00/sbMj6/BBD4fVpoMnXyP8izCnlpQIgOehl4tBwAfQiLUWJscloXNS9yybQ5zyz55hGQb5qJ1I="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.8.1-alpha.30_1572572634294_0.7152762279051736"},"_hasShrinkwrap":false},"0.9.0":{"name":"@react-ssr/nestjs-express","version":"0.9.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9721ff9c38faf27b24718c360d2dce62821b1df1","_id":"@react-ssr/nestjs-express@0.9.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-w0UGfbjkQRMHpR/AnemB5hKf+goAteN47SJSe1SrWPY6XLEarJ4yid+TWVOfgrUX3QosSodKoBa/AMGBj0s56g==","shasum":"20356c5615eef0b15ad539401b5d774901d5a3e7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.0.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu5y6CRA9TVsSAnZWagAAPSoP/28WZvtHBmcjxg3bubvu\nZwEtPbPI47oi1X5MtXlZj0lDnt4w0+vF2rTQIjeYWJQZwbAQEDa/VZIauxnr\nMI3E/D7FRae5ACI5YPvr8VAkwDwrmt3Xin8MEn6JViO3PTJcD97JfP7wVV6M\n6aDGBgvN0E4nIuyimcb1oLnoZ8Fn3Q/C0GtnirOSUjcGtpz7b35ePHUBoL0L\n9Hl3rwMwHWzfJqXlhYvhi9vzLIKEFXBk0ndmWmbcAM3hM4OdRH/usLmbEvRw\nxgiDw2EpDev1QgBAMrP3GliZ9ZH8jJz3yI8eyQCLeEUcEKCnnhy5Sw0Z0Gbq\njY784cRaIqegI4B1CI014A3rkz2EN0K5+yOj7zqkC8rdbeZ6Xv+HXhIxFNsi\n7ZPxHkiTua1uBWTyIXTpR+Z40d0E5Gxm0ni0Pl5tVVvX1v1hPG2WDrI6P81q\naLvqtavl6AcalyaDpHfs0IhEoMmvB0oMNndzsI4Di+RyuUAfJjUg3nenpzBM\n0JSQeUvi4kP2fIw0jNl4FYVk0Ob5lXIFJxMBRk0tvKVE7kJzxH7LhdOlBH+9\nNVk9nA7xzo+l5MHZ0IC2WFX+TKLxKt+fzMuXkXhYh7t7cH4HRb2x+YI6Nybl\nQ6N9MBCK/j/uKj/ES6XfTkvQaKPBDcuNbmLUJu0ghU3HpkJeBQD/+EnJtBNn\nzKTw\r\n=ZbYY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAfhBHkuiOscFttfzR2Jehhb1ON8WMm5XQ3iO0OzLViIAiAmDBWX1Ddp8UYjlAZqSMhzOX1NdfYsr5JbK0DsYyjhYA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.0_1572576442263_0.3581897814158874"},"_hasShrinkwrap":false},"0.9.1":{"name":"@react-ssr/nestjs-express","version":"0.9.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"990afe7f70ab4f118e699b508cf22a4c25820120","_id":"@react-ssr/nestjs-express@0.9.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-M3dNrxSG2CFLIl+wl6zw+ZatZG/VoDPGHMBvN8ZmXf6vTvNI6zEyPay7AFgf6HJ9iep8mgPXclYm/kO4l7qnnQ==","shasum":"ef489e2f4ab95ed924eff6859566dcde11ff1022","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.1.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu52TCRA9TVsSAnZWagAAlZEP/1mWK+1JOCYJv+WE+aYK\nMPMq9ZqfePCH1u+OrcvddCa2NgEyJ5dkAh3ghI5vj5TQH1a0wVV4/XzLGD6+\nqCyeg9qGT0Mwk2HWY/QkQXD/tih2/I3AudlRivxz7NyNY3liczN8hO9g/FyO\n7rZDizsQCwnbVHlfg9I5JkE4WXHv42sHpl+Dp6ICPjoeAr68Qq4rV5MhoNHV\nbu4YqzpN4iakyUEsWVbQWvAPYghWmHF+u0XItKBnyjflkSJhgGI1LZpUtjqX\nAKFl/eGCAmXYnq+DMmcCUTsBmfMFUh+sSfUI2zh0YvM0LQPhFICxF0bO3GRl\nig53VXNlC91Lp8BPFr+CMh0lOQD9NHDPlRvEFH59poUvrojV+7ouaklDkOPP\n63Gb7hgzeE+Gmimd4FZn3rmHnL31zfyOzjkESi1p8Pq7HUPTc3DIaq4Js0OT\ntfENtU6DeFdPogEALgtpcOWy9DkAUheqK2JdhVPRYrsCCWseZ0C13Gf6y9NG\nOxitsv2PmOH8OD9mncfk8NCN0tBH7ontqIBqV1sp+N0mPOgPsgSdSyDr04l9\nJodJ0LiDJgyAtyIGH88xM65jHpis/JxWmM09EVJ9mYhjcJNz2HoHflc8nJlL\nZRO2kWlgMoK4banNQwocNSgD/YaXle1c3kzUxYlFwiUkggoj8tTPrr/e2bed\nqCnM\r\n=rWhm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEI5O/Spc6uRaVFk1LKpNdohRaGE4/9Ol82yuBu7N021AiEAkhGGxHNLkjM4mLIKFV1GH53WQd0PDjRlwNCBWLB9gTc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.1_1572576658682_0.7078392686787554"},"_hasShrinkwrap":false},"0.9.2":{"name":"@react-ssr/nestjs-express","version":"0.9.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"bc65d3ed84938b955b0f228d9dc654a83a025829","_id":"@react-ssr/nestjs-express@0.9.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-NFH00Qt5vlgbWj/hGcZ5iulI34DPXRPhQCAWF1RwOC+sQbu35EOgQiQC++3XqnxZb2xnXXCcM0Q9iDzy2feK4A==","shasum":"932f8dadc22d870a079caca32fe8abb276555017","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.2.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6GvCRA9TVsSAnZWagAA9B0P/0wP/G7zM2cuQoPAbSn6\nUNcQ+9OTXxW8/Rv4G2a3DHDgBtEfW4OAwKAjuqy10JIbxVeJvRbyNaBMO6uB\nt4OWakpgw1BOS52WIbtprh3t+hssLV64qkw7h+32Hpd1OJzgkN7EflXMMcKo\n4DjfXVF0kesMDf+JitIy0oFwAypd14NNuWC3G9X5OWPA4AyREehWvYgBcqUF\nA9k2yQCFonM7xs/F4XNENrT7XDa56adV88Sru86pmk2EM0XClj8vHq5G1jre\nKShzTzYA30Ov+meuaosvzOLzo+9zqBNCro9hIhgkL8hq4+STqV/8RhK//cwf\nDQ2z9w8OG7HrxCpqP7/04GXNh7Hmb+1yInMhhWQ9931GPOik0PXdRdCiAFd4\nGRGuwR68dQJrWUqISAW/PewC3VpwFjvdIPFmgVFyUlEXpWq4PFgs90WFgDYC\ndDgMKNFFrR4HkaF5Q4G7Z9Zdp+yGiH36MXS7yHxu8R5Xu1DcmfwOj/bL3Ndl\n+tsJcFP/4SBpYqiQVo4YRmM0VDuYA9CD5cmVCVHDUIsaE9BW9hstFQBh0Km5\nM10urONobUtQzs0u5Ax4GDkuedIoXfUpy8OEH4HMrsAxXjHsXOfPc4AafZcU\nESopbsJNBctd01aJn02dUuUpUYTFHFZ0uVuGp2Pgijh32PWA2OeE1ZIJjAem\nkfa7\r\n=0kk+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD9L42lD/9SMHfToCkzWAFH8601iibBamxipVUWYS9GIgIhAJKFF19TawAzT3GMftDN50MJkmntxNc1DmCvWx/zZN+3"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.2_1572577710709_0.5942492789858786"},"_hasShrinkwrap":false},"0.9.3":{"name":"@react-ssr/nestjs-express","version":"0.9.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"06a3436a70edf15e608d7fce368e8eb8ae86c6d0","_id":"@react-ssr/nestjs-express@0.9.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-j2YdmejPB6Md/XQ/DWV0aFfdQ2X03Iro/AQoTK4GIil49ba8HL57RevWnML+t5TtejckXNm3DSwdFY9F35MUIg==","shasum":"023622d3141503ed8b7e4fc51443ef72295bc81a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.3.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6QVCRA9TVsSAnZWagAAuk4QAJij05PtJq9DgmGkjeY7\nJdzmE3t5SQHVJVX48XAukYUQnt7GhL6JU5TnQ8IMM5EhK3NSdSkBehyWXVsx\ng+jzRJ8dP8QXr0pyGK15KzvQ5KXmxriYnZteiXWUTJOoU92XbXyPfCOYyKrn\nMj1/D+d1kbt4hcjXY1ZLMITcNSsZffu0S4LExAhFaeLfmOlvSdN59ULMovuV\nFcZIMW4Z/tu2JrsPyQ8iFoGfpDljuOim2vvjpM91xJ3Ulad623OoAbuFLG29\n6fma1w2JZFqzR+RdhUVPOFHVWtJLvYFhL7Q5atlT4jBIYEWjMlMwbBQiNTQ1\njtwF7nTGOfIyVPMb367s7zL0DkbltgjA6gQRm89etaekh3wVjIBvn7f29Axs\nKYZ2r8NrT1qO86NgAT8Okca2Q0aFQkxHRSNMmQqpOZ1b0j9pqpyp7X0A/ljP\nKlGDaVjar+ZjeefpXbWrZpnX+glFQvo54yPBLpIVRIFHW5BWSQ3L84YzCYfv\nMqas7ZziHNc6luHZDjxLl9l6/ME4xDBxRAcWbvu1xx64M2zN+PM6Zpx4f1wd\ne1A9F7/DgZT/7MODmHGUeRBDAomFF58/D1LNiQolfdiwwxXh4RwdI2aW8TjT\nJriEYM+UyoDx/otmT0Lg2Zltsp0htQ73JwNKShCKSlGWHqQzovl0lwwZX88T\n3Pev\r\n=XC8z\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIF8V7wtBYW5ADLysewCdNeHe/HUKReanLdUifSb8rc4qAiAqj9m0dl2SaGrEIhwJM1pPMM06174yq5fnt+OePSA3qQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.3_1572578325064_0.16559705749574682"},"_hasShrinkwrap":false},"0.9.4":{"name":"@react-ssr/nestjs-express","version":"0.9.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"47df35a84043490e405f782baa6b4967d3fe0190","_id":"@react-ssr/nestjs-express@0.9.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-oRr/RtBqXRlVW+d18dxnzqmw0kiB4H+74d20V00CiDvDOJ12w2cmekUJ6ZyDf3TPtIDrEf/Poyz1+J1F2DTLjA==","shasum":"a142a60cd994256c5da52a18f959c90c7f2848d9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.4.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6VECRA9TVsSAnZWagAAPBEP/1HzAy7Z+/JGA+Z/Ib1h\nBkWt1Py1SBaM7CZmn4fe69JfRY6J+hToE2XzyUfbI3ToDe2TaYOjgxYZFjs6\nL/GooXADhxTO/N3GZFlUCDC/ZRsCWAKFpncIWvnsxQdpPVfxZ35wtk0WbLNy\n1Q5ghUDO6POnu4yzXw3USWoIwKakAjVLuS2qpIahzvo31QgUuyMWI6k8HCzM\nF1WUc5EYb46gym7pEYQn/HFDUPL8hsexDAe+ymx8/jSeLE2ouAffduCenuhS\nTO2WOB0QNTpX1ZI27C3vAIVxaRA9I7SZ1emVqHGnl92NYXTlIm3xDycZ8zVo\nu1eCJCcB03fZ1kQBO+L8LdN96GJEvEF+H3NTcW3D3tXnCORuciKgtStyBlYm\n1+VujctpuLpUuDpii3YtU7d+hLybTUaT4Vq0odzUq0FRIIVCnYWEP0Hl49HN\nLcBZSaaMXceUkB7ePYz2Wq8MakEJy8yXAjALXFMC1JkivbLhgOUjcfby1Wz2\nD+ONP2JQMnd3OFVDMwWy75iveoiTbBaBZ5+H/e8qExeMjssqzXncVn9+4fmo\nO5TSHm9k1JA0BYtp1v5L+UyD5fcque9TAfKr7YMU+ggcwmWsJAowckaoCSla\nJnOhB2iLYiFURN6j7YdcrNaqOcwSYBK5SgZCBYNK2pn4I6zlO9K1t+AXUlt9\nS7ui\r\n=yb4w\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB1mcpR6UVI/sVB60vwHY4p8nEEzJrXDEpYiYP6k/yalAiEAhZdKoBavKSbA0x7uY9vJf+JBBAGwN/JHca82rc998zk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.4_1572578628111_0.8503936150236164"},"_hasShrinkwrap":false},"0.9.5":{"name":"@react-ssr/nestjs-express","version":"0.9.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"22e321834d7f60f9a1cd8c8d9fba93657919436e","_id":"@react-ssr/nestjs-express@0.9.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-RvX/pxyLKocqo9RJdL9LF4cBu2/HgIK1ZIkAllMQhz1psGQsTNtE9HUxeOvejWvkHt/bI+fntqesO01Q3bOUVw==","shasum":"0237311e3891f36aeebe9fad22417da460da882b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.5.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6XhCRA9TVsSAnZWagAARHMQAIaa3VlhSnTpV85pS54x\n/5F/X3rBnx+R4vActMOr68sP2x/+BYJd+y8I8aqOHRdTeBvXxgJBKY+XimmW\n6AUo+JtUguUsRPvAErGayPMRcdlq9TPI9uew25+0yG7JLkbVbkbKXO/n+yrd\nOx/IQQFYcT1maG3+ciID6u+Ge36aoZDq9CasVENHKLCwVtZR7LVXCyK2RB2x\nr7fscT0D3qSrOo6eQ2WOO+wqAC4a55GFhEp+WtGAdOP2QLSl72MR+2SK5dcZ\nsZZVCeFU2HfccHK9gENLccCUB1ARu/b9ojXygy8RFp7m65ZJ9K4T//GjM1/5\n/YKTKuC7MEsaFBPsKOYTZL31oMG43rch4Hzu1+1W49qbUnGWx6LU/jkRFUZd\nEXRkCquJFJWjI9GkJxsXieOQKNVOpzCadojpc6l/q9v7QnIS9GxsMjPGtXY5\nnrkpjW2sriykTM9doqmk7iAvTxLFedpwQg6XkRO2jBsz9Lr3plriXcEpCI/T\nTnj3r3e2BVYM0srQPnLHwNG08W6T2QSGp9qi5m3ma8P251SiW+aEJ+RSKrpU\ns5Z0kjPUv3TVjTYIazkNEH6ccAKGUKHMQzUKObfNek408WfRF5jZurOG72Xq\nTDLNLIhD9NLyXJ7ODibGZGdp/9gBExK9E4sBmZCTrH21JwVDMOPF9oPQCF4e\nMjLE\r\n=a0NM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCz/34cNfqneKTrUEkRWaqc3yFXziUOjTSgNImKmFaJCwIhAKDmrRomZFvHw6l8IbVinlBOC88GwMgRYTRPwfAKV5c/"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.5_1572578784832_0.5369039122155201"},"_hasShrinkwrap":false},"0.9.6":{"name":"@react-ssr/nestjs-express","version":"0.9.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9ef57306f13759c960a6fe954866eda2f4db32b3","_id":"@react-ssr/nestjs-express@0.9.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1QTy8zBTtcZLVqYAkY3ttv4QnSYOi/4V2zKO60KJ+Lvjk5wr7lZv0FVhztU5JRV9Dmi1KoRgG8E0nqlwZc1Cjw==","shasum":"2f63d43db236d4b9e75af82b58c1f6c935066c87","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.6.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6g4CRA9TVsSAnZWagAAqH8P/2rKNQoWjNnbatCI3cYx\nOZievuLATuv/oeLWKVMHco7poZSHPqIxWNBr02/ifIeQ52NIdB82+9vRFxs4\nongI5yCHPSCNFYx9VqngM4mtU7QDsYMXhhbJpfbLXspUP/MHEf16pYxW2OTu\ndgQz3V6su0JPRinw/256yLVOXGFky98ZEW3l6moxQcptEryptjgGkG4TcE0O\n3ZJIxyc+zai2xDdGI73PEtR5/iLTSt+osnRX7GQXrFS7Zdpyn6EiqGq/lzKn\n+9UDGKOJNlfUpDHDyAtgricwHUQe5GIxiIkwvyYlLlzABoD1TYLl+0G1Wr7W\nO+TEq6e0nC2n6aEcf7FwTEP0JVWJh/iEgzcs+nLcx29k0rq0q7xp/9p+8oYT\n4HZt9hZR+p0cw+NP9mflIGvFeDWLPQdqUdsP+XaYWIFUWoZQkZKSkvD2O7ss\nht9wNsdYOuEGiB43IyN2f8xka0tFRNqo8iK9Unmt8nH5D/K701wZowENx118\no3TiUgbEpJRTDQD3fr+5XRCifBVoOkrNpQTI2II0BkWR52P9g3NBFv/lkYDv\ny4Bz5jhd1OiFO0ECQV+l6pdsz7dm8qnzK8bQed6KaMwI2LHtWO/iyTWJH3U+\ngRqXquD+aOj8qlmmDqExX4FGMGioNGikYtZ4+467wWhIQA+NrmT1djpYTJIv\natoL\r\n=BUC1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE4XjdZFmDwSWPckVYo9q45Eje4cz83u6zSQ63zRyV06AiAqcX/N8l/M+U68zKNig1rBLpyQ3FQRkVK0cB9g/z5Fpg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.6_1572579384002_0.4071368813700582"},"_hasShrinkwrap":false},"0.9.7":{"name":"@react-ssr/nestjs-express","version":"0.9.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7363afd72f145459214d48c2805ccc2b69c391cb","_id":"@react-ssr/nestjs-express@0.9.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0sVwgzor1sALKx5LX71ScshSPc8aX9G1beAMX34euk1M071fDT9/yvWgo7b6H7s2YLyXHWcNnMK5GFdFR3W0jw==","shasum":"5bc46b3cc63bb0844eb3b9da26a335e217a79531","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.7.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6jLCRA9TVsSAnZWagAAsjUQAJI3Y614E/HmP4i92Stv\n4ftt9iFGSkU/HdeDhz93bbStkKiIiFEMLausdNTNbtPnZ59zbaXe2ICUCPT4\nehzo65xHeKbJ2Y7OQhtC7E4rmOpoOMYyWy94I/v2lfpWCNeJAYfwEGpSDCe7\ne8dZZZw26HITLjqEdEqRSyAONjLlnwuIJcvoZ78z2SNujoLkiVSfU5+tBW13\n/glvisowFjcAZTh0cJ6X+wsQyGbIEKRI/pWoqOoY3B17BEB0cY2Ks8szWebJ\nnUz4nHzVRKhX6ixI9ltWFDSOQDzWgxIafyA8uPx6shUbgsQhtCpSzuI0DLNh\njF3KX4NTL1ICopuS2YZBZnkqb14Z/2oKbLAYc0nGS9yATybZzb6SmGMAS9at\npXqbTUZXfX6zFSIAf8M6EMscE25ln2ZBFVcyCSSdHEiHAWPGg5MpR/WLbbbx\nUrN3bRcVKv4GtnggsfvU+uC3XAS+i7nDfJdqT2lzTfGYnYRDfOP8lloUs5YL\nD5eVMGeP328iBdzE3ajDitLiozE4hgU7EjMMpi5wqDE2CDLKdUQvaeoofQ5j\nkuXeQ6JLfY65/eBAufBpFa01n82oUOtJFTj9sIzS+ddJlLPwzRly9jY67DHW\nhX5iDMBIrvBDiZfcyOFVFPf1Bqb0usLr5LpIxMDGkS9iJV4iQ5xGs5vvn2pB\nmUKU\r\n=nTsa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFrr8h0fCqgHcrDXIdshLqHzkElWHamAVydENtOkPyvfAiAULqlizAX5JxXj+aFxNLqaGyP/pWoUGdFMNp1nqPhugQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.7_1572579531074_0.9089171741843216"},"_hasShrinkwrap":false},"0.9.8":{"name":"@react-ssr/nestjs-express","version":"0.9.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1c9395b1c24f94add136aba8970509c335134387","_id":"@react-ssr/nestjs-express@0.9.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-T032xoyPfcnm++Wma/UmgHrSjlUzEtnGTFihO18luHHVLm1gCtDOZgDu1Mp+dhlcDcIX9eTQQ7KgnH8rhOZBlQ==","shasum":"6b7646b289919228df501e02e6ed5cc79476c671","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.8.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6oxCRA9TVsSAnZWagAAIa8P/3rfCFzO4DzLNnahkZ2H\nlHGDy3frGyb6nSQei5BVdnhs2sYaARHjr1quTHEccR058nzQgcb0hR81Go1v\ncpNAAr2gOoJSfdQeriOlpwQortJrBKMoVtoFNfmp9tTKg25KpGgBnsxDZz9l\n9/zAsa9a3tjpr6wNo/unczDvz2H5fWmKhh8hYhK5RXhVB5VT55+gWWZmHYAQ\nYWFQDTW+ZKSjjBZHsabXmELrpj9IjXufa9Q4oiOdXiZYAYKKdkppGvQTc5rN\nrUCNhNhNuGhYGaVRoPAhPXZR5EiNn8AUZkYSZvjkwL3hC5y95yyaDJMLVnvd\nNtZAZ0UtHnvjUVRl6F6fzf6LhJVVtC/bUNgZAzozgv6nR6zzOA0Zt05C5qCx\nJ7ejvaTNGOZ4XooZJM/270rB0VuEcahfqg+Mptmog3pOfpw3IXay5Uq3BW28\nzUXyFCrtqwJgBOttenzXn2L9VRRHFXx1KapxEkfEs0jtTdgBnMx1ieer6S2G\nFp6GuQxak+FkoEEiobtXZLML5JDK7YNHWtnXe0PMB8ne/GQKbF4LGmIlaeCp\ntbFuGgdG+UYAWFLwRnvaq5BqOYPpi2Ip8DK/eQtS3k7joNC4J7i1EXQRAhgn\nkWTbOgWUs++qfl0HbNqrppAZFGu2fbvXILbOwNiS+VRDqMfNzKDv9cllsvvk\n4hhC\r\n=VzPt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCzsByZ2YluFIV8BgZB9+6OB/oRLFCSvKkkGYw0MnGgbgIgRcG8BbqwfDCse+d5PA8jr3n2r2DsddyJRv+jm7vG2ws="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.8_1572579888822_0.06539019309789373"},"_hasShrinkwrap":false},"0.9.9":{"name":"@react-ssr/nestjs-express","version":"0.9.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ef66d459fd06fd96520425ec00659e6b4134923b","_id":"@react-ssr/nestjs-express@0.9.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Wfwdjs1c7V2J4DetuCAz9/aHxPJ6JNhnSo9OZRJgAiZ50E+68IMqu0NqZPSVjntGTMbL9OEtrVPpqPU3gtaWww==","shasum":"2dc7fb67ca37fb0f3238a9deb5dc5f13445e5150","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.9.tgz","fileCount":10,"unpackedSize":15523,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6q3CRA9TVsSAnZWagAA3hQQAJBJEZmRc440TcWAD7jG\n4Dovi6jIkdx45aOUWPzK0ioReOVf4JAD3+bwIhnnzOiM+nNTQD3sPGvXe7n+\n6KDKp6IONIM8P3ph+gYvuxCBdKgUL0usBw74aW2GLC4w3hw0k2FSU3kdbJqc\nYyRh4o5CufMJQEAFcxFTMOO7Skb9sRfzFp2q3IxI1N2xP6F45ckOjo6MZqWS\nh5PmpbgOq8X01BRE6f5hRRA+lIMsBy7RrKqP6iQMAdXiTpffBg7yxdvm6VO4\nFMFZ82+N8IxcbTrkB+VbHuH7aOjicWGuWVkofXIA3GxTpAMTbizsvWaNxCI1\nmgFMn4UBJ6KPcomZFBwl0Gs0k+zqS57WZzfFSgLjVCVFYDJHprzqg5rnKmae\nWY581tHb8Iub8KWLIkRLhJcdin3Y8FX/Z20RQud34mrfZQPbSxex6bwSYKBK\nglS/Uc3b1I1q3VMe1m/KkKiR75oxT6OZw94dc9+lHsu/Yv3IreVgIiRaMSDF\nBaOa2ybMSSXxRXUfuW6z9sB+OPc7JQoa5twG0BRTBFUfp7fawTmyoNRkne0p\n0QqeJfhvRMie4LvfvL+w3pzwut90otM4rNNChKNtvise5tq9wMQGN7uGZxRF\nE3QZP87G+0gALFoDZdRnKrS5Sjp9mC16VEA+3z8kzTl+SU8gjEjVdeR0qcw/\n/0YY\r\n=0Lnc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGtuNTQ4tWtI8EWadl5bDRN0J1DMU9PxR60qCYWU0DfsAiB+rI1R9mOtONaKw1292ztj/4XzLSPtT4SvR0ALz1QF0g=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.9_1572580022629_0.1527151011958756"},"_hasShrinkwrap":false},"0.9.10":{"name":"@react-ssr/nestjs-express","version":"0.9.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.10"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a24d89261f5aa9f1824000158f3e946a0c143b7f","_id":"@react-ssr/nestjs-express@0.9.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-7SRlIkfT7hBcFPmX2LWT0fC+1muEL9BpA32ELClkVFk0ANqFMcLqm7RS2Nnwykbbp10NCJHHA+zQDRzd2zpTOw==","shasum":"3c662ecbcd5ff18fa069dd8991d1a2415c57de8f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.10.tgz","fileCount":10,"unpackedSize":15525,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6v7CRA9TVsSAnZWagAA8j4P/RrG9S95MwsFejQs1kQV\nBSLzsvNg5bwapsJ8oBzt2E/OwR5F64SKYPE3A3LoS6cDCgj7s4Y2RKhUs8s/\nl66Yma2c+kn+blUBZFyqqzEJvek3vsw9msnmNHHRJgo5Oc2mN5Jgc9ULFt6/\nqmhlpXs0JB5dWEEIAo37Zi3W7O5uXyuXgIgwjbgFrveg10KD3f75FhZDm7x8\nULlY6hHE+BjcJx1aG3T8CrGnnPcVgtk6NMxptCX+ugLU4bQoFWvCe09qF7U3\nClFWokspnm2Gzq41PEZ2fVe6enrIABxXFERMHNAhiuFOaK1vfTtYETFwMT2Q\nsUnyiUY0x9gx6hGP4wTeJ1XB+8hYBct09/eRiMDI/EwT5WzLKJSAxdwCAOEB\ng5+Gin1zKp56m8KW6GXP6nMEtZCq6KV2CN4Koffgv8cTAoQhPtWpovf0pRzf\nJopp4UQTR6xV0XLy+aFcZ4ixvhyTzvYNLFFWZwq3yP+fDB81idf6cGVXo5bR\nAw9P2qbDd5x00DOjadAwIgieta5tiN+/JLeOe55aqLKISQdkimQd2q2lfhrA\n3S9uMp/wH7CPC0j7a8jhjyZnBBZ0miOof5AWS4+LrxkKodeycTLzb8nFYJ3t\nHC7U0hE689KUrddUlVsVNBn8iwASKtNlhgMlXjoVt59O3dFlhfoea3FLm7YL\nOc+Y\r\n=jWFp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIALWkqjjwO9JJBk7mNbt3hPiAvIwx+g4g4QT+7FupCufAiBRhc0ygYAOLSJ0OnuWnhQiPGJ9K4GTYMVvdiY4Q7keMQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.10_1572580347180_0.6470099796541002"},"_hasShrinkwrap":false},"0.9.11":{"name":"@react-ssr/nestjs-express","version":"0.9.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.11"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ed535c1224ad13647688900da2fbd1fbfa1d6f5d","_id":"@react-ssr/nestjs-express@0.9.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-UqBMxKbPZKrR1+pf7AisqVQinE7/9RB8/OfIZZG2sauhbRuSFP1zLqE3ID/WQAtuAQikp9llCmrlPa51GLHxtA==","shasum":"acdc1477f500ff65f61d12a30af79b8a0d5da5f8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.11.tgz","fileCount":10,"unpackedSize":15525,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6xiCRA9TVsSAnZWagAA/YUQAJ86CnbQGPpeGY+XEdVx\n25fQPgDPcKuCVpK9hUV4Hu/QBI/xAEuEM3bm6FxuQ+tLiC0ILo8fMKcIWEJr\n47k+aGUnHyBvcLB07qcrQLry36oU1K7ncRGlo6ltgqcK2g6qz2MA1vAXL/op\n+sLn7YbVkz2wdePALExkBYQAdJA+r7FENSraJ1rwn2+Z/Zs4VNPfO2FYdCP2\nTog27XY50VhihcqoQEM3M0ZD5rTxqvDPsz8cQLqKRcSVvkKMpElVM8wFEh1S\nuqUyK+3SCq1I9lQemejZp4lFyRyJ3mHYDGnpHB7oL+wL25cgGSmNJxyt7vzY\nbAIzYpAF3g6h2eHJpt5Xt0w6PoLgk5ZbYacOOqVO/H/V/iirxmCUyEwWJAvc\nfWs7T1SmumrJQ8K6eF4qFZg0js9miWREGa5r6SBvZrcjCj1PasCD37B3jS3Z\nrmX6OetTx/caWE1/4fIBCqDpk8cnzrt/9visERF/suTnLDN1f61LHwiUKGv2\n3LOOgPwgOQ1ymuWc0O5fN3+wn1sHTWvEY+Oc8xgP1yEXE59wmIQ2gaH4Ut8Y\nGs6O4rd5cRRfsiywkliUoLwTd+axnJhhJ95ueLWhd+YI6+iG/ECnPJjSeyoW\nNMg8hkV4W9DeTg0OYQKValmCmqrDxHKy8CzmU1QWW6rQWD3U7/WdLDS2ogDl\nK46p\r\n=1ddD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCvRd3H3VRPVI/WudJDLG4uMZ7oqgfncOdUIek7O5Bz6wIgbStUEzaLCO8/x7f1g7KRVXCJ8RV4QbacTk3CY0dhmpI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.11_1572580449845_0.11147271957744476"},"_hasShrinkwrap":false},"0.9.12":{"name":"@react-ssr/nestjs-express","version":"0.9.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.12"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b3fe778ac6aa7400fd581916b2d7584cc4c82ce0","_id":"@react-ssr/nestjs-express@0.9.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-UOoE1T6+srmu8rZc7ahcW8lC6sulW0iDK3iHsdgeBg/hTTiTqDFw2FcmcpKpMiNRl0yAx6BTP9XqZWltYu7o6g==","shasum":"afa74e79fa16447f0b5567426770916258e1b26a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.12.tgz","fileCount":10,"unpackedSize":15525,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6z2CRA9TVsSAnZWagAApzUP/A5Hg3y+QkD8fn/V2y4B\nL80A+scN5gB6YXP9wAfVozDMKFsLLE/qWNp/VAuUyuXUQeX/VpnkRIXAMt4g\nxDoiVwk6qTB66WUY8j209dqI97vY/BEsKkZCwp3Cxw4OVNuLxpTxSrQyCFym\nN0V3L4JzkmE+seDqhK9IGg1M+43N9OJlW0eSM8hdJBowOq5+sF6qdRXJo2a0\nmNuY7zPojtA6yusV8F94+NrpA7v8npLz88pXZnKyWh6Zfi+Hq8sMTHBcNT3+\nOWjrbFYdefO/ad0qObKi5kEXyidBc8n/jwlq4xF9cRwcsnypUBLjvPj2a8xj\nic+KFQBiF04UM3r5/3rDsBsxm0GRQWkWlOSXvjKG2q6fl+B7Kr2gtYC6q/cW\nK7fDUOzeNGgEQmN9Uo8EKeXc1aygpeCoCmyJTbl5/WBGAgoCtczdcS9TcD1H\nNRbobnrJixbQHS1YXeyAssExPUobPAePrHW3ZvtLYz3IIhht91qQueO8N1cI\nMy4hdO0KowBBG09K9Wd6OtrabJwMmAjfIPZYAaWQRhU/pMIWTWmY0ikfZ1GG\njlE9mya0irVxNCI8yiccxqEAj5j/ZUz9MDyhrWVRHRhq7hP5gr2hWLqdmbTO\nX2YLUfFUREhmipun7EpFbJKb440ppvg1rhJupYzxrVZYm5OkGYQBZ9UPUuqy\nH9a9\r\n=MlCe\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGlGDCwxbI0ofpN9f7mYq9RYrjEhBRKtEh69WqVK/m8KAiEA3jylCfXszF9BvVGcfP8ssKBo17m4y5j5k1GJ2y0UINw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.12_1572580597894_0.6079155264473453"},"_hasShrinkwrap":false},"0.9.13":{"name":"@react-ssr/nestjs-express","version":"0.9.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.13"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e5d40e6fae77dbf070c1c2984861fba9342dbd1a","_id":"@react-ssr/nestjs-express@0.9.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-E2OQqy4XEwEV9Vr6zjxv/InhbOEHsRxd/8DZsPlpJWKWgA1LRGHNhCjXfIDUsvS/Xknoi6h1wTKqPBpI5G7lew==","shasum":"6fd84783522bb15d0e3f4f30b6cdf012951df16c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.13.tgz","fileCount":10,"unpackedSize":15525,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu65oCRA9TVsSAnZWagAAFG0QAJAquQo4S1Olxymxs7hU\nNWzvBMBInbcnn8pBwGrM32U5GJ8EaUWt6eOjIVCQS+rA17PTuaeRnW7W4esk\ni1DwWIsSyxPtWg85Tuxl2pQiQfd4ohaaLywaIUOv9hMsNdK8g0SsCMdVQyA9\nYJoHf7Rl7oHXDqyS1SXT26KWy3OgltD2DAD8+jcct+qzHNvFGbeyoXDRELEk\ng7sddAk4FLyqXWUBI+TbKAvVrpg1/EQ0/F1rPo94x4xsGrJOhliWNJRn3W4Q\nCyqSmgqSroHUnj0cNptYAiYzoGYqnlsbFequT2l9GQpZ1UEFM9qCBRC8T5Z3\nWI7th36EdO1wfpubpDDdScd00/BHD5806z7S7/2/KAKpL4MXEpCTgFfYTsAq\n5VldamSpIuB8BxlIf/Sx8S2rLgmIdPIRXaJvhQXyr+86h7O+L6NnVvMbhNjZ\nklGo67IUxvixIjLo/GsZkloK7zT6wGpfAyBhKAe1XHVpbrySR+hpTfL5rtGo\nflU6p3/LBxghtJN2P/7KDHHBfvEzdr4YMuIPvFmuw6HZ1FHuFlGAscgwn+fu\nxgnWltjaR3dC6uMXjsINAt5FwJMOL8bk4dafk5y/lQB0LdKUJgZ4kAcLKzdZ\nJEpzbXRTKhZmVIXs2nSBNsfaz7ocXnrAC9p3cB4Jb8xwLBBjijFNU8+O732A\nA6OY\r\n=l+y4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC61ZMdfxdU3+nXNqrizeeoGFxBLtK/7NB8EHGA1y6xMgIhAOr0TjvnwQh+KwOfObgQDvIozseHIB9EBG7CJZMPe+sD"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.13_1572580968101_0.32631446977237055"},"_hasShrinkwrap":false},"0.9.14":{"name":"@react-ssr/nestjs-express","version":"0.9.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.14"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"50895251cb950cfa4ccccf03bff43011b4303e51","_id":"@react-ssr/nestjs-express@0.9.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4WMen/gbA95VPAGrCduceYRK5VUIXmffguLtyD5QzK2Sv60mEbx1ATIPz93QZLKuS/XSptNohTVZq2sU5G3pGw==","shasum":"a2dc6f47298a1fb1fd8563fb9cb9e43c51ab5fea","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.14.tgz","fileCount":10,"unpackedSize":15525,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu6+pCRA9TVsSAnZWagAAtWwQAJ7MAWkMdckAMOpdqVqG\nL6hfcRuNwc75EnEm552umu/bP3mXWTd4x/wb4nbJRdGRUqYZEqt1U3SJQdPN\nrGfWAeSOoiOjVD5xHCNPImqSvGOTFL+67u8OT37dFb5YSu9EzPb9Cg8/nlBG\ngO8DdJaqbPDMfzA3wU6DBhKoFOcqlGfDyTZAkBvIDbDCZL8rB0qmuT8aW9LN\namuuythpLtsNWRpSYR6kRJPFUrYF7FM53bOkVW6hmUrhJVnJAXwjrQhfDUOr\nvR8Uad66Z75PNHNipbAKctA1JQwsQ+n/czHMW8bpbY/AZ+nhvbKPJ7GoKvLz\njpbnngsBATJe/0uqwmjeInkigKuC7VFil7aQ8lhl7j0WuHSQSqSieSBoPjjk\nengTANGlFTdU8EDO07qekh6P+4cgeXu+VSxIfKWG5uU9HQsUj2XF7nWBRY/6\nN/u+jPzDKqsRJlnBFSqC1yyjv1yZEj3QED359FzWOPm7JeIhGLgcPFXH7buS\noNQCufWpFy2ObfBEzQClmxstQ14pe0+K2sDu713w8RD1ynkP61WbUEXQjAOO\nDwWJRQoZrR//ZC8z6Ppn9t83DawJUnpwmHfWEVfxTqLf1um5fD54tqcvalE9\na0UvZxAQxOMVcrqtNY7emWaqR5REcgwWlTlvISIuBz5XNMyh9MlNDJSduq2N\n+gw6\r\n=xhQ/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB4tvy6rB2NcUCud2T7ewMFdqaaZpNs+iBtRpXUJd4rfAiEA/ckfpDS0uqbj++vgauvb9gmA11WQrNqS5tmWkaRGQJo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.14_1572581288606_0.16923272283426005"},"_hasShrinkwrap":false},"0.9.15-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.3+898bdd3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"898bdd3d06a22412c967a54337bd8b20a62bc6a4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-wNQSMyUeM9ofRnmvy/rDzDhPN4JtlgGvh3ior83zfd6oCS75gKkNbfEp3XE8qzNSY1hJsDORMLllUlhRftUXmg==","shasum":"2324bc4d2e0c796d9c562d5c9d8f9c40887129ba","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.3.tgz","fileCount":8,"unpackedSize":15235,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8ARCRA9TVsSAnZWagAA6zsP/2DaLfC3KB1PjMGxdPen\na4Pl0xcvRZr4ob8P5Nt8bli1JqM2NvC4y+Xt6sokus9ldlhSGDroJB3U9ID+\no30AFiUhTT5OIaS/1J7iWGA58ICLM3uLa2mOYqHVVxCDiluNFw5K007abVHv\nttaUR4Z1QGjFwblEHJW2/kHHb8vM0BsxZHfGlXrFkfWLW7J9L7G4IXEHOkYI\ntqgTk5AfgL1M+IVp8joxsZXoxtAd0On/sVP0R2TjsLfwAaU+wKNBFjF8lUCS\nvfSsV8aykVBTJX8HK3cCb9uianFpSOr6/tR0+GYJ1AtcVyGn6slIyi80Tp/4\nkvF8zs3GidWDv8HDzZiLYnXWbLVu4ja9HO67kwDWw2ZvpoCWNlVx51A75c1a\negcQWJoeNkSGSQrhB3rq7936ACjhF0X5EJGyUROvodSGjYLPhaQ6pO0o1kUJ\npjxLqwBZGoi/SOvar/lWRwkMkdF55RtiDXu7U/V3tLiyOMfRx7dLzYOPskvS\nlsIo8SLdu0ICh8afGaqkhdHPhSQVwuWHotcBZsxstetTkBRs+OmG0XcJFOz5\n68GpFW9cnlHeFF8ryHv1Vb2VhWz1G1vpzyZUlR58HdATsN5t5O7w9owRVLXm\nS3dnnu384ypyieM2qhtGRUwiGZZiB9ilYhW+QtKhZKsyXMTErPb5RRInCRy8\nDGOL\r\n=hspS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDmtcG0fO0oL2UNKWtv0+Gwg8WDqCAhxNwLQDwc1pW/ZwIgBZeM/RoCWAt2Ov8PlofPt5EEldNJAWqxJSTlTMf4Yb4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.3_1572585489315_0.24044395456982803"},"_hasShrinkwrap":false},"0.9.15-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.5+daaff30"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"daaff30d42cf62d1d35e7d1b56a56dcb5ee59ab0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cUmz9as+W7eaguORmmUOFY7gHnf1pdLjVvZwG3c0FiaOj38PWmvNPmlT/2Hk8TLH3CRavgZHM6vFrBQ0eMx6ew==","shasum":"44960cf6dd9ab7e0cbad67b80972370ce4817e5a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.5.tgz","fileCount":8,"unpackedSize":15235,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8D4CRA9TVsSAnZWagAAAa0QAIv/HkY+T5bcYg1GXcsE\nW/dwCKI0RYyUcD/VALjx85a5ribpD1rH3/WGet6tLsEKKrnL6okrqscTTfy7\n8ortDJOziXgzAw4Q+JW4lN/VGzguC0sAp7W7K8zp052d3/qRUf3tB+fLZRdy\nDprGnZrL1dPr9NOERv0qUErwbv2N42MAkHv633AQVgzqhXPptiyiso6sLquC\nnOzgfOvkdsH1xnuS8tNL4bmkzG5f6UeEf+FoP7lbUfSxIPGIxI3LxBMUJQGs\nX0gStFci7bdtLo20zM2YEWmcKKOsribF+TTxl4RimvpwYgWl1mLEz1DEHEt0\nffoMsTiWRsldPvdG3f2BeOwihDNJ/E4afleZyl8p5eDVugK2hlPcMVDcgwvZ\n2FU0TTzRIHEqWju+q5SsdDXgFmWU2gzttM9lgb6hGWRfI5zz50ms5nksQE8z\nR8UnVhU6whhARxSsq6ag9Je8w2mkH3YA9FemvrfCEXDEdFCKSllzdty9j4WP\nRg3Rc9xQEHSZ2+ybrz+gL80zJ6ShSYdqmdtSFWwqcpq79LmZI6kKYv08yu/x\noRMbQCNxD0Usyu2mCfx4xxjkzkdXLO+zrZ9nurgLbD3cK/VO8s4mcbUoze8O\nR4f5S1ULcRNabp7cnsvAVk9alxlEuaX0gYM0BZqKDymzSVvx8Z8K2N7r0N4T\nD4Yk\r\n=DA2w\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDC7NWpi+F1jDusBvWrtQQVv9hPyfWhkyWIOfBUi3TpLAIhAOjGr1yRjqyMg1LNP2P1pmuWro/2Fng5sEmBwPIanhuW"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.5_1572585719587_0.41114177717903466"},"_hasShrinkwrap":false},"0.9.15-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.7+98175d3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"98175d315bf6bccbc383694adbff086332e14d2f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ulDCG4R2Fb7KOWrbLIhB5MfRBtjk4lm16tfQy7WLEw+YGqR2wXTlj1AaVc2mOq5Vsok+Ngi/Dkeo2PSQKhTH/A==","shasum":"12f6a51d75d9887e894df50333bea444b1b75345","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.7.tgz","fileCount":8,"unpackedSize":15235,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8KmCRA9TVsSAnZWagAAw/MP/ReP1geXBTGQoT8z064v\nkp+M+lV3tqrKise5lJx5X5yXe/DHD0VWRjuilJJ5tqifrFnrDZjLzsNne0cS\n2HvDmjeMEhyPNCz/xjpNJwktMdiEYsEtXCpq5+ml83RE6Da1f8NQlCKjYGty\ndcZ3yx5bNTr/w77Z4QF1OiMVhOV5eZCftQ9Mn2RRuV/xTpbObPWsstrk3Y0X\nNnGhrokgjNk6sv/dMkkKmekmFD8Y7lDmECSsKMe7J9e89L0uB6e0cJRYtZlQ\n6aobxAnUvfh6CL0SmvKQ3Yd9Moe1l5DX9vecGu1BVaqyC10I32fynBUWHQ4A\natwsv/AG1zSisTPDvEajSbMBUJLTcSLY6c/nPwNt5oYxQBP2xxNe+Lk+fkdU\nEnoMe9+Z3lAk7IYwBXtpf89SIqOp7NUxmwrkfdZX+ApRYgQ2mJhZbBbdo14a\n20E63avb+qoooQBUAcygX9IzYSFPwBuL8W98RsFv5HIpP/VYpQJhc/kDCkCR\nrhXK32aKv5tZQRp6Ox18/5H7GJ8y4ZTkiSkAsB2268ZpZakQd+RemfRbSpZ9\nj3k7yYql0XEChc+ip5U8AVO3WUiXbHyFqFiF11pdreyfpksVUJCBq9z/+OlT\nnMLWv9v43AZeh/scBYpSOcnfv4RmE/Om14jxstin4AQuov0SgsZZ/fm0OaAb\n+aP1\r\n=TP84\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFF67aJCa9uF6J/a66ZLJ5aUFYYCWI7OXCvoJCNume79AiA4/+nKqNDaXjh46PICvwgNsSb8RlY2ShN5UXX7XSBSGg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.7_1572586150442_0.3999064358814741"},"_hasShrinkwrap":false},"0.9.15-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.8+c52474e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c52474e5917dba41ddb0d7cc0489ed275ee38633","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-42jlO7ulm8PDiV+giMMavfIOF/YN2ruIQH99kwND/y9YYg4q21+xYgCfuvl/OYLAQPx13hUx5f5idDT5Dfv1FA==","shasum":"ebf68e9af9bbea6306e3e35e5a05548b7a56cd19","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.8.tgz","fileCount":8,"unpackedSize":15235,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8NSCRA9TVsSAnZWagAAYBMP/ivXXJ2BKFPfokrSuXlK\nIeXdD8YJ/SbZkX33Nou6qgfLU/2yzNcjLqz1LyxfRLw30vXtzREJt/2LO+D8\nE74iJV61MJUVxHx3VhYjLjvc5hc8kIoKiA2wrYnIexK0mNgjz+bVK/h07/7f\nQzGaNHERC9s+J8tP5CA1l/Uq/HhQi9qxmFWoy3upPFIZv8bHgW+qC7JnlVRv\nka/yQRAqqkzwzcXM6PXD+odgd8GTxRJfhJpvvF/0Q9eeuxDEu5kRuxTw+LEv\n3DTVD2b9kyw3dSIxroeCdIKzrUtFDcAH9598aCmvERnT9/eB7htDW6WjVMEM\nB8nX0JesIG4RbePPR2jCcjvqiAilBNmFuh1jtpp7x/q5uCFr4n+jAwWJBMBP\nogBN4oMUiESecCnx2A08ZuegIWRPrleeQfMovEveBQx2u/0F62WS5dRzp0bV\nQmgfFXKN2KnfeOb8HnMoWoPs24arI8UQdW+Sb8XqNht4zrKW+sPldl3NuAYm\nzfsOr43Fml0hYtpjtiyu/iLcXCR5bxjl/IzhKQ2PNno3/gjc3VCCd2SEs5NN\nYJWFVCPuBqkbhwUUveX2OveHhgH0iHarscpozH2pi+99ThECpx1cYqpj1xWo\n6YWjj6KNsZJ8V/qpF9NXxAr1HPN+WjkqtzmCCb5uDnIVcqMrZVhyzw2joH48\nkVPC\r\n=zIVT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDC+HliFRxpg6CfIoMi9mMw80TVKAi/r+b8NsjhyLMViAIhANppgjsV2z0ZpbgMam0Z/UyNST0vgowLvImJ3HP54kpJ"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.8_1572586321941_0.15054353342467985"},"_hasShrinkwrap":false},"0.9.15-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.10+f5ebc9a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f5ebc9ab35da44702898fd0535eb8ac3d08d7904","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-NGMHd4WPY7cTh25bYH1/aSROoq6Af0s94ZayZrpaivDazqFbVs2FQoz7LepeVk8XvN1zDZAx6cF/sEnbH+mwWw==","shasum":"042b2d443c6845e225cd9d3d37861bca9130a883","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.10.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8TNCRA9TVsSAnZWagAAgZMP/2hKlun2QlOtrak+KdJH\nB7JpK186E22KVspRecrhQ6LhCgMlbzwljk4Z4xpaLo7vpcpU8+RT6K9z5xVG\nB7fIO9CaJ/opjFIDTysezAGHfVAElF1mtxp9QJz6vQOV0E+IYHhQVqQTyI3R\nKndB0Rzo3v2pV4gCKF0UODrf5uk6VSgU8k+jEhbn0vdX5gTc3rkHR8SvCB5N\noxgk0N9aiGaX0O6yREmR50OoLGdgwDKZHMSsOIYafHyb0/ozypiXKQpSpDK7\nWm53qqCvjZ8On6BZ/hC6t1QUeHJZLHaIAqedMjrvrRefWIHGvlsm5MA7+ynl\nxL3kksrDQ0DMJxcry8CZE17T+g1Mm8NTEgcDdCHjsN+qFTqnwdUUP2Z3/goe\npPVfGiAUu2h+xYPW/h+2t3Ge948hfEydJ7EIiiG6YpijkSEnwLFOFjBCcicX\nwnyrOsOo0ai2GeBIehNxnrjTACj0rwA45SVJ4XEOsqTi7FMu0qhnkX9M8x3p\nT/1BV+0Spu5DC56AA7qD8QreqPxm9mj+2Euj16/pM7z8YGbRvQENzC0Ajy3Y\nZG84pojQo3WtuzGlcKVxWLbo3jLriK/eQ+GJeWEtXZebbkbpmHJ1p0aDFf1R\n5P7XxUX5+Yl65ISqkyzs3jsTBMYpOd56D9bEFhs4gy7UcF3c5dvHFu02/zHE\nK2Gd\r\n=WGc3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEO243gTXoJa10nbOHHx/F8ib8mgBv2D3zRm4P+PgcdCAiEA/5MpViY0J31OOY/VSd3hM401jXmwzgPPvXg4JD0oNyI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.10_1572586701031_0.8402503171672404"},"_hasShrinkwrap":false},"0.9.15-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.11+c33f825"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c33f825115eb783d20e5bf1b6a107422ff699690","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-CJCmGvNh3STVOcrFt9UHoFC1WqdUHDfLIV5tm45B5KCnEXxLKPt32Y1AjnWYIgyUomq0CEMoh6Oua0WvMopDgw==","shasum":"3fe7bd7d51af2a0ae19c74e73d70724da656fc4d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.11.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8VECRA9TVsSAnZWagAAnB8P/2nmoRMc0FrmpglB555A\nEW+RORGHctBcRZfnDFLDHfYA9OLwkgNpKPUoie5fUOwLV26ICbQqdvs7dtHw\nj/BgibAiaEgWnkaOXjGU38Ujb/Y9uWDXBeylHiWCqz+E/PAnjgR7q03CEb4w\nNK3O9l0jpDGrW3ncla/4fEFdYaFGHuQXtve8NADd6H32Br3QzK7x9/z27pdv\nxZflmDIyNl64qE8ZAqJTkb3U84uri94PD+txJKwQUWUlVjdQl+AGsvU8g96z\nxWptFAgkcQnXiMx9CFSJSZMj7HFeB13/rD8kqwFJffRI58PuCKl3c8a7SFoX\njdL1PDCcMiL+2whBrsGc5VtwLGbf5ds1aQt8TKPPcnyPFZ+ytEBcqbi7eXjq\nnbGUtsjhzXrF7d6YUlRBVfVNyDrXdDJvgQMm0OG3Gd4tTfTAu8Tx8H+zvqtn\nuJz2kX7/OJIkz/tCJzDrJKbc0db85eKI9Bb2GpvieUdxMsJCSKl38WfywIkN\nqJ63AXJq6XCuNVRgVWh6P8iNbZs4FdBFRMe8PNd2TX3DOeMmD2NDpoGWWLZQ\nv9WoWH3d6jmpjh3I4dEz114QLGpIRONiE4BzDO3YUr/KWkmavqlaVWeo2AgU\nd86fPyNp8689K57Hi365CDgO9GHIzq17uPRWhjLuUVg1n/duk4suEpACAGZj\nx4wP\r\n=cQXU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDlETOChtGYzdJhDIgqaMqXmvHufSRUgPZ7ywlKKBTMUgIgCYAUSiZaIKlby5loAfRxnY9uP+NJUe4ShF+pqf6k7Gc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.11_1572586819830_0.44863756264199717"},"_hasShrinkwrap":false},"0.9.15-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.13+9ed6b6f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9ed6b6f3075af7daa91eeee177dd00273971ad90","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-7c+CCM3vywVZOGiQQkCg0cmU+rvpiSoiPgiuOfa8DEkBValidiI9058zBezVWrDtTPjZZY4Xmof8eRt8zx2flw==","shasum":"6f0959485b55ac64c54c5bdd5da3bd51b6843d3c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.13.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8geCRA9TVsSAnZWagAAajQP/AsfJi6HyemJvc0KOrLc\nfyT7Cn5CfmWD5bgRdu/g8XO4qQMy9wwFwseLOszQFJPV0BcxdUGaYeQHlhUh\ns7fkNHf7p1kfiaf8tRmlt+/xEY6ZV+yo/SNW41ugXEQufWbKcMIb5TV9vo0G\n2zk1wB3QdNO5D0BY29lKbYvuALygU8UEh2Hef100oG212idsBSme3qwuSjDh\nss28Im9QjEucVK/IqWOrZnN2cN/RQhnBRbr7xuFeQrOBVSAU6MjZd/IglvRt\nCs0u0PLqOaxBI5btZLrVjm3vOhByTsC7DWvdZTsv7JFajSFzb3p4emJ12grT\nwUvpZXIz+ZK7rYPLBTOULMMaJSEH6vX547VE2GLjTe5rUbNqqfpGL5wS6Q+Q\nwprJF1WsitL2Qew61Hb0PK9crBahHiB48WiXSX/9D/SprRtG44bwgFE4z+w2\n5cfiAcPJwZj1pObR4IbQHgBFbzQeYvOelwv8/GBJSvqYOKqN2400IFDoxWXr\n+mT6QSC24uxKUrnEoU6KSBb/4NAajc7yZul5gRQv99s0TaXYwJvknJ7kQsk3\ncnY+6TUsTuASF4x8T0z/+ojDQuI83WDUxx6lufUKCW8iybzteuEAz2oHlx3J\nAVwsN4/gbbVv34qiAllRX2NRT+ZsxFzAZrF6Wn36Q+HuEZ5vC3rZ3D4AYTMs\nJ1oc\r\n=u7ec\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC6Y7Vh0mymHAxcxT5X+92XitMyk0lwcOcfnDzz8wlxSQIgd+EG+HkXMwmXqCNxD8N5ArkjGNgDozN1toY3XggKMhQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.13_1572587550249_0.4122094299668291"},"_hasShrinkwrap":false},"0.9.15-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.15+e67c6e1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e67c6e1ebd90820380504a2a4012e672caac3e71","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-SWBOz85PUpLDA1a8URa/NMUcxWiPhUAHrBg/G9lFebcwVQ1cVCI67ov/CN+SYaSbuclo/EVu76rUFFx8WNXqvg==","shasum":"6db8d9e837bb01a8c00736d898c65b10d9f5fb4f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.15.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8iyCRA9TVsSAnZWagAAUeUP/REdyVfKp+KG4UqmkWSL\na7FdcJ5Pk1kvm4uei3vUEoTvciFLuSRni9bU0lh+B2Gv1BH0DXXefzfyL8lt\n1CgUg9vvdSVpAcdvreOv40U2L701OGXeFc8+A4Y4urljYXCWEQ5fJ6sYY0Bw\nQHTqs6W2OnjDSmYjgMqSEol1jreJWhGSpT2toVF7l9E/IqxCLqgSslLNTzQX\nOFAOu20XWye9gNMtAe00Se3/WueGiC2vKOhJ5XABDjzMJkoVa/nNmATqzkm5\nx148dhUmYbec7MwiHQ0wMM2tcetmsayn/b15BKKaYmxt4b7xwKDJIvIMuB77\ng4oZywdoYz4vQYM98l3A8UUt3UsADXsp4cz618VDrGqgYeES4AG5aMegVlFc\nszjwOzzPrel9Ettz8DccDRBOqMtag8dlUyvlT3PzeT0i1EdBIdwMqN5jWBV7\n+lfA62dxKFWPJhzzrwHvnHIVwjcZIr0EBVSr05fkz0kij7ymJVLzkCy72Uby\n91Rz84VxKESKWKElM9Aq/c4X1AdK4JPU9+YbbO6Xph97AEFzBPshIx6ifRAz\nq3RuVgKzLJtTkGJRrUrOdWGtEy889BysleSrCfl+YebCGfOhSjaMrHGe4Bs2\nY2mY8xduRIEApXxO4xGWfSCGlWbctkakcWCNbrWdec3qyy4mb+RxnaEbHDGW\nnAed\r\n=tZ10\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC4mFbPo18OqC4BgiOCgXXJZHuVAlhPhi6qfOfJeCjAnwIhAOkdUl1guqZBBnKKs1tmRt0MCcC6aXVQHKzfkJdUQSHq"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.15_1572587697638_0.5186763672088233"},"_hasShrinkwrap":false},"0.9.15-alpha.16":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.16+dc9b114"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"dc9b11413ef423fa70e03e4e2be2ac9ce6138833","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.16","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2/alsfXgIGMJsLLg8z8fghx95hJjarqDGir72UB08fbje6OgpqT0i1QZirA1xWBr0W9JrlWefn2fEgFlVvCz8g==","shasum":"82b3d76214487063e2a4339aeb4f8dc03f752f1a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.16.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8n5CRA9TVsSAnZWagAAb1QP/j8CDfbLsCacGf1/xeoe\ny/nNTTjtjoBxLR4pAviRRj1xzVGBZb9biwsBP0Tv2OnHd7/VAq8pmXqEmPyb\njvmOYmKma9WtEgjKCQ1F6HPOEidLqiU86LG5yYonsPxj0ufJNMdKX1PasIBx\nvQgE4pQ9V6WJ3etrSlTdshJqQ9OPwqX6sKp7CSemp8EF99/bvElGrfzl7Ofj\nT2l6kV6j+9MeKR16/B0ooVZTyBzps12nZvu8rVxHnDpkmNLd5EzapSagqN9q\nYdPxUuVx0YMMIx3SqttkM+nmHhrAJhw2Nx1sr6ONj+Rh2v+dAOgLDwWMJN4e\neWYaGvG1wZfWUzUQ/yqL70boZLuLte5QodpBYlc+Eb7Kq4ad/WkgiSSTpxsE\noDK7xtKBFqVbXQTwWvSdXIORGisqMWvLkEyKSKK/qxamuwnDfqhd6WbnHOTo\nnANxgciCyzOJtOKQ22/jUyPIjqy7MAJc2UhAmHPKY5wItCP9SOhPbehBH5iC\nLzkRf02Ss4gZwKuE1SCmNjMw8ShCpIFBJj60X0A4fXty1nOe+ifqMo7SF6HA\nyjrw/a9dxUHcNejahe3cHV9doJ4jQnFlYoMuxDMw/OO2V9IBxuLjI7uV8ASM\n/s9Cm6x/3TWghqajwjuFzClTRLYeztYP3Xlqeq7nClFB0e+gk9nMiYRP/txU\nU+8o\r\n=rmaj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD06NILi+mCWPYX/XhIYnPo5ecqXFLQZmIBOav1xVD9GgIgLE0aL5FyCTD35tq5FECf5vXjMUkTzk22jpAwHijxzRA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.16_1572588025034_0.5507631798931021"},"_hasShrinkwrap":false},"0.9.15-alpha.17":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.17+c3bea50"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c3bea5066e2d10001011f53e6effe927dcb195fa","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.17","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Ti/biVsovf4Y6yXeIRuLxV5+98WA5i92uaQzGSYJcb2UswuV7GJr5ts+fwjox218DkCHtuJtaUGXoxV4ziLGWA==","shasum":"8dd363f30d719de8fa5a81f2a139b59f3c6ed76f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.17.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8qICRA9TVsSAnZWagAA80MP/2Du6eN/83PrYI9pmrvd\nKHAa1M5dC6U59A9RZSCkQ7eVxie+yVcLsvDVTw4ztzxsOV/AeK9ZhMezKMyh\naG4/ZMPfsgsaj7ij16+YFTAM1VsyDQoEhWNPkvpwuJxaEgZk8i5i1RAvV3Ne\nRIJmFUsfMtcvmE+xpbU6IhZAFugqN+SdnC4mul6Y1x2R7cpR5FOeG2AzcaO5\njoXyS0fC1eLenrnb8GzrpI25ol6Ge10ZHUrAQFsMXUn2wJXRUL0GdO30TByo\n9uA6elQZ6tWsW3hV+AqmG+uLLxM9K83BNBqbWaEF4bmusv5RT4Cx7isv0wLU\n7sE7+jQXeZ+B3Vm741N6Fd1RfuiZJ4m5za2p4WRTxhpYVDIj9wJwSm/eN1Dy\nDL8gVaveYKCc54vZ7nfOr/qo2tbn2bR3JHwYnff7UwAfdvYRUWkLbrBeLxFH\nQIGbxLdMerKSwzsPm9pxIQdtd2mNEdhdX8xEEUsmKs7wDZYU48mLoDd5B1fn\n9+eHB1bSMJqxzSmH4Ng/j13MsOA/wC8OGjW9cj+whTjtq8bpfNWXD2HY2Hk+\ns6E5b/0WCwbnv3dJt5sl0vvy2xlmFAL8lzvuviyAa7F7g4BRAYVJGLjl+oSD\nwuSVFSyXeFNRp7lKSorSktIFxSVS6GMyROzfmYDve9lnEjOIBRo8bAVPiEYH\nKpOA\r\n=CvZG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDqGyC24ApKtPhmBi/RBMyHpOo6H05jIClQD6M5q6SeVAIhAKpcnqRHvfyjvpZ4gvoetIUKTwWLwz+4v1HYLuPGR8jg"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.17_1572588167870_0.5843912716245938"},"_hasShrinkwrap":false},"0.9.15-alpha.18":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.18+cea9604"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cea96043a157e14c088baa1a778815f8b88b67a4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.18","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-88a2MpN7pJloIsvOGk380mPAS6qDVbe//ypk2/CHOIzp4eIpOevv/A4pnyhGryCzgjJJrCYEAEx943sAKDpo7w==","shasum":"f7dc99b09aa8a14f0902291040f4257e41c258d1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.18.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8rwCRA9TVsSAnZWagAAjDMP/2Yc6Ee5mDy8zxmYX9Dw\n2m9DyctoZHRCfBDnXyD0nAQg/7Zt9NC9ov+papPmBZVE6ARLYtIoZ44YKwPY\n8Y8QxsyJRKfygBkRC6h9EyXF57zHoGU5rDe01nKy/ygSiqyp+4H3tkE10hrb\nvOhTwQ9iezr+tEVkPrvP6LBQ7CEoRSGI3W3GvYgp77sfdn6VXR2WYDVO3OYD\ngmZNPfj2NTJHtZ6QXcz070cX6i1+Ef9znm1UduckAVwNoiXu6kqORSco6yDP\n+MtwWQDJv5w+CFgXKiKhtZ1G62TaYtoE4+XOL5+LWzpT3GGeUCaesCItvolh\nkgMoGcKMYUmzuPA3WBq2lMHkhhQCE5q2nMJT0ApkigmeT2NejTWn3OiHAQBP\nwgr1GicQAOEK7tx+sZ6yoMaSdFbysjfIX1S7JG1r2VIAVu37ClyfuCmt5R/O\nF0eVwTTrHfZTIpcAS1bILzcV42nx8SVuAeIffDRzNPJJ2Nu1eRbxBYtOL209\na4WHkW/p+4tnya9NSVCRj/Nq2Uw8f8VWZJ96fFLLbisMlt2yOWfBCA9qjuMo\njPl4VCrSxmqB/3PgMUuNLDjTdwuKrX6LKNQRUJX6CGT/MwoV8I6TJoZ5a+TY\nODz9BsWAP+szfdb0e641bvZBCAtMcMPDwrPZORrxL/wqqyCGrtNiWUmM3hZJ\nXhGQ\r\n=2UYw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDx3Jl9E7JHoImo2HIsdXNtbqhYIu9SHHEAsAV/yAiBHQIgbHZykBLSmOqz9f6VnySLLzMXN/5+xt7HoFdP+7OPZlc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.18_1572588272222_0.24095691399793484"},"_hasShrinkwrap":false},"0.9.15-alpha.19":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.19+b0a3f6e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b0a3f6e6d0823e20e4551343edb9ce22f45912b3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.19","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-hBcQrzHn3euVL5lPB9MzUj8TVr8mGJUsymFT2nZJpBNED5GkaTpOJIHM5vhQFSKSTAYxG3aOR4z/vil8Mg0Emg==","shasum":"c497fcdb94ba092bd63187959130c1b27e46dea4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.19.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu8tPCRA9TVsSAnZWagAAmSYP/RSgPpyN+JVdUEnDZ1US\nSIlAHP7Ye+0tGUHfI8oRBqx1gZCEnatVx3Dw1b5UN6qXDiN9xYv0Imqr/Q0k\nLYsKE3nUVoIvebjR5gbOM/P/TkU63ZHmM2O4vIVc9i/TzHmp8C4CLm6gkRaO\n4NLsI58NNRt0wbYwkfH57E/juZa8S1XGHre7DGfQrv74s9qp528cbwwrxYdL\n5hKHYIKhYf6nDvUrQQkoMNqWppGun/A17STRpDfWLuOpF9gNKoiUxLWnTeeW\nqHYKVj27/F6UYGKnEEVNCp3vKGa+39a8EeYa26HX8nIaBiR7xPT5hW/9B83x\nO2DAEXSqm/HpJ5K45s8WTy4Wf01BUIJgiq4bEbwz5gh4TUL+cMZwx8jVO50g\nI+HAH/iZLu8L2RndumELuO48W5fU3a5EZ3Ub3Z00tLVIfL/88CkRONaSJtnV\nGKZkRKi5Rk98JW3Yd5T0QpYSPyZj7SQn1u+UJzpcSn5yfwVwLuZ2bG807tdS\nMXfLY7gfIoRh0G5XrriXkORL3dYruGBZwYWt/YBBMiTxA/8d/aXVoZcHTtmI\n0Egw5TqIIDweRAA/Sas1gfF+hIighqlmSl95rBANMQ7/6pauCn5wwz3vEL/R\n3Hf4mRDsYkNgo1DZc4rLIJtFx3APMZrtd7xe5OUcu/RjrX9d6bK5EGd6PLaC\nhh+Z\r\n=Alif\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF3acdkvZnBbqQjXGcp+giSAVhnH86Y7bYHwFamG1+cJAiEAzNCR5SanBneKmlPyup/B0svmbU2bRazETu0f/yTfZrk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.19_1572588366717_0.9739347385528525"},"_hasShrinkwrap":false},"0.9.15-alpha.20":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.20+1c47432"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1c474321d98836ca80033dfe0208d59e6705f43b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.20","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-3S2oyv//2KT6dOc869Shs1DpyN2LtKj4wIWeKTxxPatpaCd8SC05eg7k4evSyGRlttLP/PA0uqHc0Lrww2q58Q==","shasum":"ad8bf933199f213aade932387eba5e8514d0d1ef","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.20.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu9CQCRA9TVsSAnZWagAAFugP/RWMkoUhEkvEgB4VmhiB\nCg3MTjU4GCfk4y4d0H21naQbppIYfHfuTnwCAcdUWqOy616Fazuqco6bLcvm\nlbCJhSvjOQpFkMesK7jB6AvHWtkOxew5VXBjQUjMGq8rbdBt8fqgf04KvjkU\n6YOSqwxBu7JS9YBn5wYwYyGqn3N7pnUAPzNF2pZFMkjxJQS14+3J5TmUWyiM\nOB2teDCqL7ZfEmgXWgJykTbJtMP8Joqi9gpckJQnrxDIlSshGUckP9UKJXKr\nkImgCE0Bphb8fAvK1PEfY7m6BoUV/e4urRcA0SoiS8QjB4OE0U5Pj2QotCRV\n6XJsLUzmXCAcrD3UiimfjEyoekqmCkUi3HD2I06gq/txUWfnmSqzcup01SZT\nHt1AjVieOIAgU8CUhxeTQM951X5Qp6Giarrt8hO8Q/v+oNSK7EfPWqo37TdM\n2Rudtmd7+znuMfCBA/GJi0hLBdxRroNd8MDmUWWTkJtcAIUm0JAgPVVU0Cts\nqebYxK46SQpDZTffE/ubEFmmP+ge/WmR2nB6HP/hqqir8cGHJuQ8owhB/pQu\nrlO45EGdIR1ZQe3jQ1x+GmtgNXCYSbfU0O8EI05IdLyrD6vpG4Ovz/XhB7L1\nfQYoomIQpKLAe8gu/+m7UZ8Nk3mleqIlSfx0pQm2u+BiFp1m8Vkb+UTfba3R\nF3pP\r\n=rtQC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFzyx19cQe5gyV3HEQVfBmPR+voNHnUeXcMp50Qkj+cwAiEA+OGKFP5L+k/21TZjfKLmMu12+XMTJkZjWS7LKidvHyw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.20_1572589711738_0.4335375546571163"},"_hasShrinkwrap":false},"0.9.15-alpha.21":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.21+ba77cfe"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ba77cfe222da96610729a6a3cf440143db2392b5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.21","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-AewmGM6OqeOcL7+qt8mjMqnW3WFeQpjiKjEeYyWu/CZWyDxdhkVUeZDaVQbfgCEf497a7R9yr/UBqgfTMavAmA==","shasum":"301d15ae2fdd32a167c2f71ec6068dade628642a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.21.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu9EPCRA9TVsSAnZWagAAY90P/2uHVl5W6wvc4hXsHHqs\nQJqgyL8f82cHO7yK5jj50MqX3gRjMSwK0Ehd17rPH6GZJqGvigZ4yuwaAVn/\neaOEda73REqY9spBD8JY3j64pFg9FdppBisGUaj+Cecr55wsQjCGUErTxPn8\n/CG4M77mQE4Afrzu7PEoz9gTOXMlBfwlaZRNfXrQjkRiqPk5u/Jb5id/XKZ0\nKim1AtRi8gYgC98sntVOFczjVjGPDeCoZQiHEaKFi0jovXrpzTPG1Ly+J4K+\n8Xp19gAUcsAf0zXCSPnLUEoXqk48bxuSDDGXmseRhm/NAzGkq7i5/FY5unNj\n5M8+OQewbywFjhGmHfoqIUFlA/7C9/Nj6bxlAtFy9/kQmwWoNsRy1kc7++aa\nyUT++ORkWwS7cs9SuLMOHG7QxGj5936nKWXOuh4TZSdFNos0FGjL67ILhDLK\nlmy0zCBQ1EjoQ3GImH9OMIOu6bHO2aIoWtiYdmAAlLvlJdNT2jZT7Xwtfagw\nLN1RtWdKb/KGLCJON/6VHbmh+sBtiTQYuvHO+jVVSbxKpcr0VQ4pTIQmonW0\nv8s7Uawj0iqjwuOApeFTmAY7w7rHLr0cM2EBjcC6xhqfR0ZaVEjfCc92HACU\nt+xuLOKb4Cp+LpsRAIm9lrYuOLEjhYIjcBI4egRcHWzPnMa3U7BGGoSmsmA+\nUVIu\r\n=Idp4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFxwUsY3ixjKrc13RTFiHUNlqrepImWCPI6kPo2pJzqOAiByPBrYpXw0nNIlfEX9NLs3aNeCBf9GhCycWodG0Sqruw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.21_1572589838569_0.2503823125720297"},"_hasShrinkwrap":false},"0.9.15-alpha.22":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.22+f2cce44"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f2cce448cfc1722123697a0d666d2370e48af582","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.22","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-aDwwg7QZjSSZzOJ/tHxCUZj3eXMe4odAeQDm25JrslGqRztv+aaNySodFDU8/6VkI6dLN8AhzI7TruoGObIn/A==","shasum":"f87f46d6a8b5f95933c66d6e3c497c92c0692696","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.22.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu9GfCRA9TVsSAnZWagAAG8oP/jM9KCk7jR76+Nq0QBib\nahpZKhaYVfKasmQVwfO/UYQppdq3ezJCmnnxb698C5gsFcewRrLXFc1wZ67P\nRr83ICzTV8HlKhbUSIjOMakmrNSP226wPZV7Gc8w9FQ5kmIlVDeWnJLiUJo8\nRwVoAo/ojwdsAHakyZV/qgMIIJIZOv/VI2oSLS/mSX0jXzir+PVvvPO+RflH\nyeaUzK0m9650ako2pibGSwcYFohDt7AXAocKZt7sOrLozucTpsMgyC2KXb4A\nzMfy0HKG5WX893S5Ku2fIsjugFy8LngG8cUCoBI1cRAA7vkRHSyVDQoC34Js\n6yXXS/kaxoaenuIXVDd4aDR5fMv7rPPCuXv5vA3prPqOF6+Oib5078xMhzVu\nC67VjzE4tgSzd7mYcZu0x15zhisTwV+QhzKSYiSMO5cmQIybcXnQ8PqhxZe3\nV7SC36QX2wHuqOuz1T6K3/zZ4NhXqtbhhLhRQWq+bVUaJqYL3cSOlG917f5j\n0x7RrCD5bjGpyc5o11I737NY1y+7Fr8yU7g2SNhTAu9gwK+1qRTXWkef8wyM\n/bx5RIsKEkz22xl+L6kFMjJXOsK07fC3II+D0BY0AjnanPjbZ54QSfkXMCwr\n3j6Ic/k9Uh4ChQ6kYFbUfbHUU6eXqHaUsrAmze7Ss6PTdUOljs5qZ5xFNZ2u\nFFSa\r\n=9I8U\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDFp6j94RTJk2co94g1YbB4yge1LxOp76KFOBbNqm6m+gIhAN0Q0DPpHvYxAXR8ZgnEU00NpBrjVssIZXoMeVBmUHRT"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.22_1572589982699_0.8563283491299778"},"_hasShrinkwrap":false},"0.9.15-alpha.23":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.23","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.23+ac339ba"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ac339ba1a734d7ad4920adee96aa00fea9a9ffd3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.23","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-RAhjY1p7iG4jXV/k4cM+oVdkHskgM0Qb3ijfpGGwdW6wlro3C5yyhW5nTDFJsO2FuKDXn/0RCblPOKrl+reCew==","shasum":"bf6d55c13bea4e4157bb5921201788ed7c9294fd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.23.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu9ThCRA9TVsSAnZWagAAlxIQAJ++IKcXLUgYw/H6b27o\nE9hBM53RKccedbmiXMn7gOIyEBdv21xmiOXgbTCykFvpYkPYRonY39vKDra/\npTR/hPt2TSy/NBn5eo/BxDtqaUcFVcE96AhTkniRCNjWjqWgnTIwGQEuGgYt\nsDFrpFKtjwueD9yVgeGX/vmhL9aiKYsRlfq4FslqS048fAeAYtvn+RG5pD6U\nTvMRP+u6AySYuZ0JrLhhkbCmYpS/QxSYqmeyZvt2ZvSdhHTfAgez2gXmozGN\nN6c6btkJxPPWggY+wqkrHwBuaUUROVgDgFPyDKlDkAU4eTkRdVnUNdTMcxD2\n/bCFfzS8zeIGAbD05efgAMl54mca4VXIDGBtuT2lJVORwHojPGEBFf67WMWn\nKhRYKFEYgO6zvf98VE+BnXn5XjOti5u5irCc3FMexHOfqE7/t/Ju5KpNSG49\nLTF41bmFjTDM4oigT8Xleat/sqtMMVQ4ALJv4ft3QslhzBb3tqiQj9LS4Q7X\nhuEwNFOJJJuV5QlrMhAFile7WoeA7YIgQYIinWT8cC+xMDaZ7VKiv0kSa93I\nGLPDzMf/ZJBUnUW+Rxa1XxEKGWWLYzPeh8E38dZj/paz8b8b2skfp20D1aLz\n2hW2I0TL76nXbwwyGymD1Sz8yntQEpEvVXU7YFLxouStoAXypd2YdFM6Cjst\nPIaM\r\n=2wny\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGsa3pl9JRfaDphyeMagenyc8w3oLuXqilrNu+P58VuzAiEA4rgvh1Vf9HMY8gYq7uWRWW4My6eIXQH+Vbjvf4zK0qA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.23_1572590816960_0.001121167532731615"},"_hasShrinkwrap":false},"0.9.15-alpha.24":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.24","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.24+ee27e57"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ee27e57d1c91c59e363ec0ead3c25d0870313dde","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.24","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-kLBsnFMEkd6fKWeYX0QIjQXbzK3F0q2hfYgOPOl09JtUBrDZDpRjgaz1NPFIdCDAe4utPQX3lZlWZ6oRRUNX3A==","shasum":"03a43b53a2d8757e96e0761bcfbefeb09abcd1fd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.24.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu9nOCRA9TVsSAnZWagAAQ0IP+gIqRcmutxpHNRQzoXE+\nS0XDN1+HbCMzKYa+V4pRmemxHblYHDOz07b0jxIErqJa4yusFcpAQjLhUvdt\n49N1RggGbDgnK2r4nh5vuxcHEZae0zM2VlaV/sPt8O3kKxiSCvXWbCoZl7D8\n+JR1Q/ZLBlyNPGkv4XXArks6WxynxdEVrY/K8C4Q+fIm1WKrY0EWLkAvXFyb\nH5ZqI90VPT1cKLvHkuf+niqOmY8qu7AJCdVRp2O0HHtq9NbNVGTLUWbsCyhC\nUgSVmNkkfoTAaedALOIxbSZmHUdlwk5h6eXZx0psm7kki+eGypLbWb/Yz9Ar\nOuMb/svZVHCmSj9vp3ToeY/ZOUVvI/orpmPRk+BnPgC+PWJFFOl8NszQNTwA\n3+aCNAQf3Ykh0zGpMkIaB/YynmD0H2TGcL5dpbFnURL8ddBXwBSmQe+0lVzi\noXnlSvF48vkjzimZ/OhpL4l5F1dELFyo8ClmmCcCF/6B7U1Q3bRFFFwQwdfT\nf5apT3QEgJiHvFwVJtOD6gyywv9x1UO93c0J59ntYb/fs7bk4OfNuaKf2V3+\ngZ6Ium46nwVH/n0NaYYCW8rZdS3Ce57ICLq+weTwdBmt+Ysj44hSpNdzTsrb\nDi6IwSbnu1jVlLbD727Lg9tsaxk0+yh67lBMr5dMmqajMwYsE9N8unfBb9An\nicVV\r\n=FzyS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA/VlwZgU1hjZTN4BSZmZjcV21U5LEXxcFoiogxJnr12AiEAomdl3+BX6T+r7CAfYcuqSEixmifcR9Ck1Yp61PRvjiE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.24_1572592077807_0.06505104778158732"},"_hasShrinkwrap":false},"0.9.15-alpha.26":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.26","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.26+4e9724d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4e9724dc791d1d9f15a1d0f3e65d070563bb948b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.26","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-U4hM+DvskLIMGk8SvPjbXGe059FiOrGMZPFZN6yXcvIQcHIzl8YMMKeO+60DsiytH7k4+4P1yvdJpPjkoMa1Yg==","shasum":"53494d4f8c8241c55673d7c3a00829a4ed182269","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.26.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu9rXCRA9TVsSAnZWagAAVY0QAJAUu1ALTaVYZQdzuZBv\nKwwVzhRNUqaPtPO+c0hgcGaIWDIpg9CmO2JZC6NKwTRs7vLKcUJulfv6iMT5\naHitmB3OiyB7FSeuaQbnGLEG7uxxvSYIZGChuWvMhYrE19Qn5a8lBQrGvyCf\n+mnP23Wtz3YpTGX61U9HvDru3rrVLdtCCD/mJPTEG3xdO0AGlIoIMUd2HjBr\nm/h2NGUeU4LDIP29itHAoIeeWmHTvYs733Gsw7BFkCY9nj8rEUg/kYE777HU\nGPeuCxtrjz6WdLRW/gC41OXIa7SdkHhzqpEHqi26cLtAcQQoBw4SV121w9+I\n8yymAJVjIdRpD/jcKZMJnaetgwqfurQ5YJKVh3q4rxap8H1UDgE1+O4v3vzK\nKiSi4URw8C40vikcdiwqH7gdWHUOT2PFSbIuuL0AU7pZjsVp60paE5rrmox4\nRXAeEzxWUrzxjK7hhH08EJiB1ce8nT/rzH60dLQFbAn4Pwr8/61vKN4a1dGY\nNClqq1fMcdo0Yr0ud7gTHiTX80CBq0VZiN5XWeq/+enuqwu5sUnJVXiEH6Ig\nU5u6YWocB6KC8FEfn/VsBRUH+WJbReveeT3UdtAHx3wljSfaFdvotQZAsHQg\nP1DXvvHInk0V7IwBc7RKFx1ZuzIK8+bNQwWHgmKb/Tr1O3BeiaMXFIRKBXZS\nmfJR\r\n=LRcY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHiLnn5KZCrfahl8kPCGjbYvTpGvf9yEfgaSB4GndKFzAiACsOg7FdKHvvHUMLWcGCFyFNh0d20vSOucKEvjxbwzIw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.26_1572592343242_0.5641512635748946"},"_hasShrinkwrap":false},"0.9.15-alpha.27":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.27","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.27+eb01852"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"eb01852348d5611c40a92200e4674d1d4bdae426","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.27","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-6IpRHuLo7UCMxTuyQxiq+cFuRJY/UUvrtmQwiCWwMoaQjQJ+NIRANqrOtCZGnF1ASrOqQGDwZ/eleqHa/RgrKQ==","shasum":"a6cc298792d7f841f11fcc1b0cc6e51b302e819d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.27.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu9sdCRA9TVsSAnZWagAAMucQAJoj9g1yBrG6Cc62g0gZ\n35ZxEOZ/FliKdv0nt03Fs7CTVeD3ZnSAJJliWs3FZzajs5zZf5ZXKySilts9\nEjc5u8R3v/Y2sF1yenWp6BNMpdm44IrrS+VUNtJFJhGQnt9Ckk+7tzIArozx\nX1TRTSuo8n1pqW708VN4NFv+a8y1bgKbAC6tghPHHIA4vwvMZ9bO8+4XW69S\nNXX2LC5UrsjfCJPzavDS8/n5plOpEEnLPyx7Q4YNp5ksTVqg4hns3d3LBiI+\nh7WXDXWbHtpR3tAPfw8nlaoYzh3kHTDBG0zz/ujWyjUmmuvsKroHK6G0wGd4\npalJEMAFE5dj0Hm5wKOs00kJ1CsmSeYrRIoltC8cb7dNZtOI8bwU8O6Qnap4\nFp8sHbnoLHLUadvv2vUAFWr+ehdNyoYMuaD1SM5WK8sJhAQHE8bZ8fvO2/80\nx4cEWh2puk/RvA5K445QWqXw5K+N8CsB0o5zbqO5LIkOu54WD3xa37BzhmKq\njcik/cwibpLRemZQPluicPsowHauAN2E4aXKKFN4+GXd3a5ZWIYhx1h0vQAy\nMEhzmxDRNF7j2tiEVYFQn0YVgupHHesYWkvbuwjkX6gU8YWiIDrnwOzHZrYw\nGyCpDn1EeIO4JVGVdfzui1w0PID9NhDjftVnJCcmBUp58xGJWfm0p5itDmyy\nCcF4\r\n=+S6h\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDHFnrzt1kI2SsiE8gTw+FVRBgstMRMfA74ZKzoZz71WQIgaVFXBwun5Wqyb+tWhdRCMDDHGnB3c6/E+IyXGncabX0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.27_1572592413282_0.1805693012865599"},"_hasShrinkwrap":false},"0.9.15-alpha.28":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.28","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.28+281238e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"281238e2630a408c6e2d6e5c5c3a157395e14630","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.28","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-loH4hDw9vpA24T1Q30ujTU7qjzWX0pZ9BsYm4WrN+23P7E9Z9nL3KkWyF9NvgIAr/h/2F/gFKj6pKBf8RB/mjg==","shasum":"9abec097311240f2cab13cf583d918655d82b663","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.28.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu9xdCRA9TVsSAnZWagAA9nkP/jxzhdCBeTPD4MqDcYvM\nXUVIfYaCT3nX6pD/PQYgMSdQoXDLA1v4yox5NFc6UjkAcAYRK2kzwaED+fCo\nRJuTm6gO10TCc+wMR6ETL1fH1u8kGiCVH4jRaZgY2Ka7HXyMX3VSvUMjjdNk\ni9h91Uk5IyPmZngfcvRnX0sgCBhjuyrrlt0tuDhTLSFMCY39Q4qW6hZAXS4X\nddom/ubY9m5Y96I9rMaSPxm+1nyRuUzDj2kmX+yY2MXorzJYrIv7b0jCP9/y\n5HHsr2dBC/tigqZ3rfXkh0DzewNcbbNxUB+zcPU/6lcjug74YO/gIpIFZZ06\nVGOBxF+/Yg+M4SKOv0+IxXw6Ow9RAB8fchcODc08HjV/XSZUYP0Og9v8LrAo\nejdkiwfm4n2S9pJFJBtpcNjyEIHirrFEegpTY3MgBRFfdzrn8vK5fLF99soK\nzFDC6ZB4l5Vfal/tHktjkmQ/Q+0c+0jGNdBDV1hRHeR6DtvBP7ftV790+erR\nX5D8VBY/FBy/ihaxvJX1rLQBRzB7j8+7+TYwOvg/WCkgbPTUdWKkX5I+frvH\nDZ481ogQ3+A6l3R0y27VEWW/vIu6VusqMDhNWX7JvH9HqgRDoi2PCfmbDXVk\ncMXI6yE8ygT8patF77ZkFsaMx6Bo1gmsgOOYeub5pzIgALlroY2eZwlarIlW\nhNGV\r\n=965K\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFBBj+qlTwSdbBwtUr815pVwm8PnHzz66Td3ytLVzh6bAiEA87RaWsjMZ8txzVcMBxJ4NJKm2egj5OxWF7KLxOSvCFQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.28_1572592733301_0.670103126417074"},"_hasShrinkwrap":false},"0.9.15-alpha.29":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.29","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.29+f09d8e8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f09d8e88a5947611b295d8ffa5ff12549ce0deae","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.29","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4o49YXfEMNPwzByaAH8YDrTl3Pf+rDMVWwwgMGtkB+BQYjTasZGPpro+oFjC1vv350camNJhkWsPTgfIbTVR+A==","shasum":"af50c6bf0e9f59500ca2e57a220cff3722a52b2f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.29.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu+IICRA9TVsSAnZWagAAtIgQAKSaG/wYUpFJgmnF35/w\nufGJ/5Cj6WP0fJswVG3WaYFqLgawm9ih+l2+4RU8l6E7kllTuY/j0n/J7SSV\nuceun52de/LTbsVO+XIjkHHSqsPa/7wMJ34TCOfWeReK/MhAdtkuGcFYXoBL\n4dof9YH+pIlnY81FjtgEC9DX+4EFx8ZH5lguzUC5nFH79rQRb0ixwjU9xvrK\ni5FUC9K+68FprImkvDpgQZWQXQkPJ4HIaZJ7IMmp8NdTJ5gwUxtkbf56ap/b\n5nVR55JYFi+HdbnCkiyWhocn55fv2Sq6b4NfOsta4b2oY1wQ5yJuf2LLKfub\n0ZhYdwnebRyhYV1Leu6jkJx47zP6luBfvJTmV3M1yLf7ceWLMmqHJCl6R4rk\nnZI3JfbmWsbg/eiAf+D/8dyZdhuXJPxAAlpm5nA7Dmp2LxdZEQo3VoC4otqv\nPdlpjIFgWuqjBLxPhS84yu+CENpDkSAn1UQRjrp11BKEAeezHtlHTlqJ2Kmj\nsnGBmOekl7XeORS7byrlN+3Dn/sTzpMYG059BdqXJ2v2Iix+LZF2MJYEppxG\nUiuNFNWAoKysmLklV8/YP3Gy6eQFyh+06NSLSXkOhF7wRnjXTPoX1UaY9jqr\ni5FvXrObYMdtMbA9VeEmks2n+qDQrWh73/i1fwyPj16dw2ZtK1IYHev9ME4r\nzetf\r\n=mHB3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEjA4unuT0qZrjZgVv1jdR3kSoUxZ2Tk9y6w74Ja+ck1AiEAzBXEVM19+IPEVw7nIRXHPSjb8HyUIM3Zkr8YxbmwwlY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.29_1572594184254_0.2497005561640644"},"_hasShrinkwrap":false},"0.9.15-alpha.30":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.30","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.30+9e80aaa"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9e80aaa36c49113df31336fd1c7128bc7c4d5674","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.30","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-3l9hGh157zhw7kABCt13iy+8MFsdCIpq5UihFOWWgjHoLp2Nu4DGpNH3Y4Uu6h7ANOCgktUMhL08vRPRCfuGRQ==","shasum":"7639db7ecd2a5b8ddfd7a62ef81845dfad55a5ce","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.30.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu+LjCRA9TVsSAnZWagAAkGoP+wYcdaWIuhUOyvgk6Qlr\n9EGUy0bC0syE+uxc0hxF4RoC/1enFreERif+nJdHeuUqInDN8zLI3vPf8HYm\npxr166vpvw7+QOv22Mx3ujQiy6I3GUol41RmD6Iz2bJ87Dq1vTBf81kFBXEp\nXpMTh8pp6pMBzJCdy6WbQ6qTYYnZTLiOVkMuu7ctf1ldqudRuxbtuNwBMcLc\n0PBDyOsBATSqV8kgalcVMCfIoxjZR03Bf3qkzBic5yEZbptual8zX5UeIMJ+\nHtPCIXyW78WHDWppC2Nvt0eEtGs2y+ec3pwi5X/ibxZ2Frb91FdsHIF9X9Bd\njvBlrOjXU19qlO/VKRPmzHHjraDFWVJPzbh0vrBzkdhh45sPv68K5Sf1sCJ+\nwfkGx67Y4+waacbKWxZAAb2jbdRG0uFoq5kS09tVe4ZnFYzB1WNmXBykSUVc\n3BNuPU5XK0eyTIqbRt3pNiJaTTng3eDpuF4u7bBuTF6NTwUSmm+8dns25YH3\nHd5F+RWkhErdUAzR4Nx+3W56xIR+/rAtShe+d4wAeVVWqWx5E86z82UdxYhK\nevbRP5DjAr2xD1YUuoYbIWgqMkbx2HRJOU9jmEN+GxQvPfada7vAEOsz6xTv\n49CjP1oQTF16aMeeriaVkwP/j0tfkZzBiO/DPQK9AgId9hiV+mL3ZYcSGr+Y\ng6o+\r\n=p2tV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCu+MXE3UCGTL47Uc8FvARqoth0GuBq4LVYQCtyyT3RegIge4PCR+WVoyJ06PAKDi5GAejB+pSX0jN6Thb/Y4mJTUI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.30_1572594403016_0.5076747045820047"},"_hasShrinkwrap":false},"0.9.15-alpha.31":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.31","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.31+5c5d9e4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5c5d9e47d39ef0497bf51d6da5db3d2f745375cf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.31","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bsHxLFrVUl9LWpeRxJ3aYbm4z0BTl4ZzhVntrERPWo/2OHBJEm/QWpvgaXrXEJgDGBjn2dgHY/22QzBdXJtpoQ==","shasum":"3f00267c35c89f280dc3d40bd4a781a8f1dbc799","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.31.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu+PhCRA9TVsSAnZWagAA4FwP/0f6r7KolMJb7V+zeZHZ\n/thSLDpmP7Ieh1wMYNLrxUJpkF1D0m8Rn9kvgAlLeYbxrdn75kEyaFXhLw7x\ntxunBMgrq8PBSqfY5Ygqd47qEHVrLJu2FiPAP+eZWO5UuXDA4bHsTl2LwXx0\n5LyF98gSCcIPsoD+k6gVzsNhvXhD5SdY7sxk23vOwS3sA+fu+/JzLkVXWJqi\npTgjxzxlSK9CVEFk+oOiTMQl3xun4qn8pgCfEZoQyuSGpUBUQ+KjxAr4oCYd\nBt4fFHgfpmqzgv26oEtkLLKSpxA/Eru09cMwyqbB+Q6GM/v5o50uLHeJvI4j\nqke6ZcSbqtTBoZtS4lxbuXMwiu1UQYltwvwZ3Clt0Oyn9/fGmaGCoRiNWrKf\nBM26QBgTXxfcDC9jOK1hZP7tTEcRY19O3p8zURWm4oMBlaNAOperil8SDgx6\nrd5rxe5L2x5LJbi0hBID2Vzx9D86LmDTeE2vCkYiAE0KryLmUPJaKXRM9h77\nDgIvH7IYuaKQ2e4NfqbzXXlD8A9/BSlTXacrVH4UB88FzH99/1Z1NKdmvJHb\nOc4nULcYK/3SqmV/N3auk8gTbUCG3IN4Yf0MEVTPIdgbNgHAHuJpzKlJoUZN\nXjnZaEDcfsIn0Hk7y05q1lj0EJlu+RQKoBiY/D/qRf0vw0IDI7yKIiYPCLyc\nShm7\r\n=+9He\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC4lq+FScmFLnH7Eq522WfeKDf8vTWP7+TIcyvE4zmW/QIgCgqb3dyVTIRIqtTSNio27cv2vh5JkXElBa6JU34H8SY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.31_1572594656760_0.019817767273355935"},"_hasShrinkwrap":false},"0.9.15-alpha.32":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.32","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.32+4f35758"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4f35758e4e2f6238d602f6fe9d8e531810767afd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.32","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-+yWyAFV8OOtb01umvxX1i+HviqK8fxfGIu+8/5XKsU/X3evxdI4ps9Isv6WQ6XIBawHfcQcJriYMhqRAn09Ceg==","shasum":"b67e78d82e575f8ec5de7e823b69266c2f7e8d41","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.32.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu+ZmCRA9TVsSAnZWagAAXfYP/38iUUaICFayEdt0f0Wr\nhpdUL0DJTCOIg2qE4UE0jxQntInUSAzJfq6L4iU+ri5hqrINCO+c+HTZgYlp\nH5VbubdTOlpUPDsrlEoYv9j4Fk8A5YBE3bA4kUka6/XvMZVtioYaUtpTmOPY\ndv6esD7KDVxqcdswC+J6oRGPZX7n/B9W6sOKaHf5WOeWTgrxEezNcEy6Bi4r\nsJh2OoauvhQAOZ+kG3jo09w662wedb5xXPPdOTob8lBge1sB+YOFscdQUPz4\nCcQ/E4oaZWa7a6nBFG5qLu2W+iBdbnqHjOb3YRsGjmvCUYTeiMwZCfwUjvID\nNEPLDmaPUH4qy/kXnyxOC1lYxmwMPI4U48cuSae0L74a+RZieBvCh70rCkA2\nFJFYQlpgQkTrUKZLXdTwO77SEcWvVYrrPOJaGLoocwCulNy7+jvMaFO9X3+c\nmeEqJ0eXeFYLlkq6MTVVAiHXM2vSO2Yz+xJlHdEAtYWWxujeiAZo0IVOmhND\n3aDUmrJOiG5tSuZf/WfOeHWK+9++yTGcB4RjNU91bGWlr0wqkLBFXNhb2mUM\ntnxFE5dFy76gbOT6FhASUKKFsjbtzcLiUjcqnAgVA3J8ssSlYPtoY2NAuNUG\ndYChKZBvIeVbOrl8qA2wlsFbtFecepKEnDQ+a/t22/2FKSCuEIWWhKwq2IKS\nsbhs\r\n=iOeF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBy+ouy85wfUgDzG97H7S9NKVzZwdzaHJlE7LawxoLQGAiEAwJY4+kgKfSU8KjJCHq9en94158h7kI4Rr1nN2F15u9c="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.32_1572595302121_0.5478874226813801"},"_hasShrinkwrap":false},"0.9.15-alpha.33":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.33","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.33+75d6567"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"75d6567ac9840a103c945b332819c848106a895e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.33","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-nfoiDNUF229Wq5rxEUtEurhg11/RixI/njRHA2XAjidZ4Sa0C3i5nqZXoOuVk7E74vzqjrbpSrVwTO7k6yYF1g==","shasum":"faeea274965ac46681372fa598a9e2b42ab0e051","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.33.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu+cvCRA9TVsSAnZWagAAhcYP/jeGqbN+CpENBKwLBVgt\nF5Vza1zaomdjNUKbKHcu6dbpVXA66piAfk1lfWI/PjQRxZU+ZekfMMRzwIV1\nEwcihLcox7MzZOFw0AkhQcSfuGZFz/E3ObMmbAmoz0NXXL+bvZPs7uNJQ1gW\nogfG9861rf06iSsauuv+wmTEEcDVOA61E3gxaSoXulnpvE+bMIMNv9VlANuA\n2k1fSxPEiIdazcE4BKTIhb3aoNPimzbJPzlg7OT/2qc3G/oWmsh+Vf7LuMtb\nS7SmfIy5DFWVwUrmxCyBlANzZeubX8GHxc7yuMOhtGanNL6zgwGCwCd7MYIz\njT0Kstwu2G37cytt75zQ05A1KAE0RQGrKS9zIFD3Vd+B6zOkwStSxo0xC2+3\n9GzsCiiInmaBroQuh41BJ2HJGKs6IWfQXlQDqFWJwSE/8HuRCf+8mwWr3PgM\nevTEHdkeIXNM9UvwOswINL5xMxoSlvpMjCZHc59NfOI4LM9o9oDHuAelyJyy\nuP5gUh+4m6p7DawGSQW7a9CNOxdCyd8YEyVWXTcD3wv9ozUSC3GAQ/KHFb52\nfFdwvt4fTiQBXd6fhfJpxsRfVy5asDlXuBIobThRZ9L34lPbCV9NInhSN3c5\nAstEOAejq9K78IKNI64KlWiMAjK0f0AxPdWKRMdPYE+6FWD8vIKIOgbee/wQ\nOaa1\r\n=Y38D\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDP1/JYnn9UDEJsjP6Bd+Ocb7kSgWfPxKcO2vwm4FysLAiEA5l4mf/u/tO+up4C4peE/qdVuYruUFMXRK+TxbueQOTE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.33_1572595502998_0.6097879890122004"},"_hasShrinkwrap":false},"0.9.15-alpha.34":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.34","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.34+f557939"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f55793973699000555325208a755770050cae281","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.34","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mFshBiIWLSLBgNb+UtQNNg4nkZPNJFW3cCnXPmGYcAWdrsHm3hJGtMr90VwY16pU+VMBaqAD7qjOpNnSOUbTpA==","shasum":"611c7c0ad03bebb8170991000e5ed2821eb63006","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.34.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu+sgCRA9TVsSAnZWagAAljcQAJI5YNPZUyOuCxEE6n/t\nc6JlOS8E7YsOq2JRF1vgeRaawpc+2MwkA6R6hK6Vj/E4sDKA237xLLRc5bCE\nJWqKLyNVALcYfXeDFEmXb1mAL2nUSJLPwjmKFADxxosWx316NHDGQBpcT13q\nQtjC35ffOQ5gPyAYnrjcVSBpDFOJlXiJIFHqkoUf6nNgdKhrsQRh/j4oTw3+\nio1QhXe/6pj28oTF0A8E8A4h/yc5IXvKtTDKSkRUfhDInPWlZprjoLlEPKHi\ndsnxQBBKRHQljIp+yuPJUb0PVSVVd7i6cYSV9IQojQLNM7m4T7MXX5pfsZR7\nZWShSYTHD4+wfpQj4QKVi29Np2nZCN7s45xrc9UVMG5L23/7+hqUBWtyIBB2\nOMGW8hs0+wLzFkOeKiDHm3su0zkdPENQgZrKMSPAb01mE7hxAQudCODS2Ui0\nxO7IT+wv8ovZXmiIUONIKpPNe26axRTnAGwFKi7DlrizTtXfikH7cZIR+4rZ\nOoA0bpd8/zDNETc4k1mDaW2CZ9x8kCR5JJnUG9h2XsETFLzkik1Bby9riy+r\nDVQi7dawieaDioPNTynim7vQSI1MAlsc+3cEXPJVS1b13XPQHw9xm2KFyJDH\nzH4tjjbTbF6q9QzmPGDwSN00Jqq4KOjTM9c4mxRo96WiXi2wX/mVdb/MOCpl\nzvKg\r\n=l+rW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEDl61RM6Tjru4wPXkHHsZswQzLpelvTancDtu1gTf0mAiEAgUUl1akIyqwU2jrY6T6WfmAAIgJ3fZn80Ngdj4IRfk8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.34_1572596512244_0.5243970117969572"},"_hasShrinkwrap":false},"0.9.15-alpha.35":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.35","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.35+273ee8d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"273ee8d883396e2d5bf19a515467a5293119d3fd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.35","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-vhGfX0tBwZp32Rs1cgUwW3CUlLpOwvpdt25kFYvTaWPBum7aI6Fs5VMj1cxZzLCOG2BAt+BLXJaeOk5QRdnohw==","shasum":"9ef2186e1957fbe68a1c8f17700a89ba312d1dc0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.35.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu+uMCRA9TVsSAnZWagAA2tcP/1kU/BQnQNAwoMIN+pNr\nkpRcAMMjU2WXsvBr/gkOKi5orG+zq+PR+0rx0X5/l/JXA2j7D9cz5x9dt0nA\nLAmpk8e50zoDGkPEv8i39wqe6c5gNsRHbLovA3qCggjgFtYH3hp0g/YlTJJs\nD9Mn8TeEngTojMZy0BIen8OSEPSBxD90RI2OQZz7K3jNoJhVgeok//NqKHsF\nqffkBMgITVeUUZxekCw/OW7aj/UMD2Pgo/bpCZIX1+6b10hwhXKG+wC+u5bZ\n+s6vM6WjkFfIx2Y/yXlRRMtUnbq8m6IkHfrwvuX5+L/HTKc25GUtkcYUkjOC\nVQjbCraLXfr3BJgfiyCdxk7Ct+4Gwfy3pbNg5YF1i1UUvHyGnrVgwIWvEL0E\n7O+47/p/J67A3IFEbZZqx+ORJzExGj2nxyZym651re7ELMY7l8wt4+/XV0cN\nBSNWAlLGSD3zI2vyonHWzNcX6asriPb9j85z7j4ugjyDaHKftXBLnLAs1K1N\nni3OuSk7szotip++D+iECMHWVBTixEwn4VwtWfKBQZJGzVq89FDi+uVZ9ksw\nouBW/BunakME9eIQjN0wzJbwkSBNGH7dvCbecNWPyef34vPpRMhxcZmGjVpq\nM/CCH39kIhbrvxzEYu7ctMqDAqmWxz4vR/WZxkcMvn1U9p5Rk54UzFQ/h1I4\nYOuw\r\n=JJ2T\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCvgdl23ayTs3AWGOHbTUkrc6FDoxiL0MZZa2v3A9OjKwIgS0REQF10wtejphm+/hWchxuZZQMVaAa5hfyDsaTw7t0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.35_1572596619953_0.5914753951494167"},"_hasShrinkwrap":false},"0.9.15-alpha.36":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.36","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.36+b9eb26e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b9eb26eb8c25423ea84ca85e4621ee85355a0870","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.36","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cimcGP6GQHix8FBsVh9rxXX8QM7SiyJytI/fyDxuaOWfUu4DGs6Xn+GY4euNh2YxZLn52+OuScZqXfDl9E98Xg==","shasum":"53637b57a8f18315f8940a3d5babe17c4061e11a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.36.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu+1ACRA9TVsSAnZWagAAY5IP/2AE+UxCPBDdT0zbjSkG\ncGgR04ypFOyulIC/bwG0HN5jMsBAcwGHKIxxojzr4EdzobLn3nkx/FmRVcWX\nicydOBSxAIRA3Lve+ADAAYvaoZCBJJgTuuR/q3KXZ0h0NFrNJzCw78ItFPTa\nfXqsygnRTX2qq7aj88RC6WoYJFeIEJL5yPDsRx/cjwP7dJGEiCeK3CZNbP9W\nl0yTYYIT/dRIFDsmnNIA/zRdy3Pgw4sAFx7qoKzgKARMkfvKhoX0kgU/suKC\nWvKkdfNJ0flspNTq0qfaKjGGHj8O7U8Vq8Pv9XjQlwXoS5gqLdxGJaiJ4rQc\nWSzwqY4MMVs7DZwdy+HJweH4b8Zwm5g94yTzjcA0sCXNR24xlCtFjwby4QBq\nNqlZ+vKlrPIZAzN+Eio4oAWh3joGUWay0c8ONZWg2QwZiVwpY7+5e170+bGb\nx/TnjJAOx68X+eIQCxutIPC8RdgOsA2r2NArNGWOd9pBUpFOPi5ayMa0c6HH\nB4G2tQjkSL9km8QwE2mnAjxb5zTyuySqtdv4zzENlqCLUD1VyyFGX7Wm57ik\nVpUYbuZSLUx9SX2g5sbSm2w9QA7fir7oMJNDmHrsHjDlYEJblqZDYb596rkW\nogR8X6S6GVcFqkAGcNKUtoGe1kgRZRLijx3kZQJcHceunEkr7HfZ7CjTfw5x\nAiud\r\n=YpQP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHlZPRkl4hkN8upGKFzZ5qVfOgsAp1c7QGGitNrletGpAiEA9eARNuRnzXY7tYfRCJ9d8rlGLZ4qf/xdLfr8i7ZNQQc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.36_1572597056317_0.9471414722405425"},"_hasShrinkwrap":false},"0.9.15-alpha.37":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.37","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.37+8a9d24f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8a9d24fa74a970dd252f1f7eab7bb2701c8b5a4e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.37","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-TLKTQSS6J8bPsaG6WMWPH6y9Y7xUAIGQEND17LCMnJY8Nem9yGkyA68QA5E92/Uxm3+i3TpA3O9YYiqF13SW1Q==","shasum":"b199ffe12fd4895f492bdc20495dc73dc9dbb217","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.37.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu/ESCRA9TVsSAnZWagAAaIUQAI1znZNxlHMH0AYJvSSw\n9IYDnMbfksH9XnBn7WznAH122hDuYY2EgV+ddHxYhA17sGQYEx4w37+lqa2f\n6oIHYhSkyATJfR2UzN+Sjoep0F1uGe+i6UNKsymakJUczlK9EwJo8QH58eyA\n1AY09pQatqH9jSFGsTPCIbowfeteIkBD69AxxsTEa8Ypvq7fpdK3q4UNYQEm\nogauoa3UzMw0xDSAsYdwB+qVz2IJykgZJdLGC+40x7/6YwHOUrqmaj0k4lhB\noY5fcyux68VySBjZK3gysBRKsF8Z5VG/gUNNaLvRyJHCgR5ffwYdrzooPLsO\niuZjKXKDWjH5caPgQEgZ/3lzJ64zcm5cNlcVDr9+JfDulwUSmuYrm9L/UupV\nGn8eZqMdV8yaBfRTUb2siB2qcc14OMuccHFFaBoxKmDAaCIkAhoDz0NDfU3h\npLR/iAWLnm8j+4gTgSIe/puuHf6WRwXMJYVAcQZIgRT4HGb3ViShQs7hqgOu\nSkhX6QmnGbBtSjdzDAS0XASCIvm5tfbCoah/P0ujKMbC1XKqg2m3cGBYmeAu\n0kg156jLJtFQwtNZYCc4nUrzhmM/iNThW5IN4jqrQXT3UbUOJ7Bj/Epfhdu5\nQwYb/10RbBasZ8aDyFU9OCIzUSBn2UkgND3dTQrWwoR0v4RHUS3TrYXzU108\nlYK7\r\n=O1ip\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCntG+0Cq1Nq2c8+GPTquka9yhokd/wOvBYih//NBJBpAIhANbS3RFaeNpZuh+U90iKhI7q7lc6rm/yvl3YJjTWY9NY"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.37_1572598033971_0.0604187727346468"},"_hasShrinkwrap":false},"0.9.15-alpha.38":{"name":"@react-ssr/nestjs-express","version":"0.9.15-alpha.38","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.9.15-alpha.38+65ca758"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"65ca75802c648a649abd5e2103ac26f919ab5b78","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nIn the layout, we must inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n**./components/layout.tsx**\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const {\n    children,\n    script, // passed from the entry point (./views/index.tsx)\n  } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Layout</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it like before:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  const { script } = props; // `props.script` is injected by @react-ssr/express automatically\n\n  return (\n    <Layout\n      script={script} // pass it to the layout component for the dynamic SSR\n    >\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout script={props.script}>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```tsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello Emotion</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nFinally, with custom layout, inject `@react-ssr/nestjs-express/script` at the bottom of the body tag:\n\n```jsx\nimport ReactSsrScript from '@react-ssr/nestjs-express/script';\n\nexport const Layout = (props) => {\n  const { script } = props;\n\n  return (\n    <html>\n      <head>\n        <title>Hello styled-components</title>\n      </head>\n      <body>\n        {children}\n        <ReactSsrScript script={script} />\n      </body>\n    </html>\n  );\n};\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.9.15-alpha.38","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-xlkpR6ZeyTI5UfRqxKRfzHYxIBfWvo3k1hlRynu/FXVaF6MavylxmJZ1qylhzo0XYvB4VcazN3lf5TzwgfoeqQ==","shasum":"feee39ad6eb6f98c73d0e8eece210b3a4cbeaf2a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.9.15-alpha.38.tgz","fileCount":8,"unpackedSize":15237,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu/MICRA9TVsSAnZWagAALA0P/ikT1wytuWqzvKK2b3mZ\nNdXmccPOPKzgWF2zxLUGiP/NmzIUqUqdFXIpq6/dKiW9GDKZcTFDbNojfrKe\n9D2vsQ4/3f4fSvxCalz77IguYK2ADl6y9MrM8AM6ARsTz4pCr6FPbNO2gvRi\n1IyCjt3i40rFnhpS7lXeBmorFerPMv87XfmENFcZzj6F7yblCUJyBMq7M6v6\nuLIN9SOKLr1119qosAtGOhJ4mu6QQFYKSmwXUpBOHNa3M/e/OChpwqqCwGsv\nDtyEtPQKXa0IOA/gH+sJCzCJLAoVuFGMCO6S37rHDIVV2EGZfY3naQFVMdNn\nymGgqahwqNB6oKPseYoZu6M3jFSzeG0xL+KmJN6yhFKqswRlwDj9iQERu2U+\n4pF+VYNWZWtz7Z/qa+JZOnU0f3Y2nM529XbnROA0D/29ZIZumVj3xZbqDFGE\nVwmR03Y4Z1qkWF74D8nl6htg1edEvhkfwtDmK/a+laddY8rivuJJeULSRba8\nZAP8gMkB3CospuoWTNkPRe2er9xIOafkJPWJvddLSwub6wq/ZTOpbBO2VbLT\ndjpBZ9aRdf8hiTqLSlkBgCYqUgBliC2dLzyAL8jP/dUsHU/TN5AknGNdi5Li\nePAr6ysQJdBK9sqBjsrzRbUfJ3EipGk5/QDvVz6NNabUT+iNjadznTSSMgZz\nraG0\r\n=LuFf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHhVKZtoSSmveri83aLQk6pRQYTQmnjCPFAvsy9j5WLUAiARAuceP10guXi6oQwFU6hsv5pPQrN62CO/CUmF2hvzwA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.9.15-alpha.38_1572598535956_0.14831987465235996"},"_hasShrinkwrap":false},"0.10.0":{"name":"@react-ssr/nestjs-express","version":"0.10.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a69c365141af97c8516a0af0a1180f1f8842a311","_id":"@react-ssr/nestjs-express@0.10.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mCbxFHslbK4SEyPrFNSleVX/H8h2HrmS1oLdxteaBT+attrwoi10EFK9uNznLi/wwXr3tx9+siUbdR6qobjDAA==","shasum":"6c9009cc1f70585e7d3f27df5e7ba35d93da5034","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.0.tgz","fileCount":8,"unpackedSize":13869,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu/isCRA9TVsSAnZWagAAc6gP/0OjqqpXuPq68yff1P/L\nsJAXos95SsI4Ve5sYfeIgYMOkq2GksuDJ+H+JDpWS2tJM+923vwWgWhgXdzY\niutLmMm3qq+9ytXnuRhpjeq3rpprGIJwpbHsJva5Xk4jCbzsIwjRW7VCyXAB\nhZOALav4Ekl098IrOOo+jW9W75dztfXKJiRxVgBzzoQ5Oql3SG35y138Ylys\nAzhXJJ4K4XO325DQwiesniBLjySZabg0f0Yjdy8Tb24e+yfQY2jah3Ex4fOt\nsFTrQVBWzP5qYsoeV1ZxsBDQwGQRLEvXFODJKoUxGGPmvfmHRfjYJnSIRMil\n3OQ73mlZVcgfCJ11v4UymJ/IqHHIZYyikMc3AsZmh+6z3S00arv9NDC9bhGN\nqAkFNjHdEUyQ/4esBJRt7XWaY8lI7vPyHvIsgf08ubqX5qihA/0pRbnKmqU1\nxETnotDHM9QG/b8fNOaeTUE2/Qd/1eBobeWAP/2RslOi2+iy5rTRxZh4TOu5\nTUBJfg4XGc7JEDQ9rIczKQhToNgkxqRhRRMEGfDAh/baL5uhsLJ4n6imoB1r\nveSdVys7VghTeS7NKFXSUd6+PZDG4LYq/hj1mjq/VGYgxRuDLzktfOkBwOhs\nIUlp5FzIjIH/E5njWNvwVVRI0ZcFXLG9A3MgQ7lZajGfm0V27vLS1FrAYvNb\nfK7Q\r\n=ziwG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDiYOPSlGkzqKOxMASYWUCZmgk1uipiYLAdWPQSgUezZAiEAiGWfnvdc+y+VhvlAY4hSNzyi80Lqq01GT7/ecIPNHHI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.0_1572599979958_0.8958000772311638"},"_hasShrinkwrap":false},"0.10.1":{"name":"@react-ssr/nestjs-express","version":"0.10.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"462637de5dbf036f7aec9e8cbfc842425ff89434","_id":"@react-ssr/nestjs-express@0.10.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-P+3Xss0lAx94Yfxo31HunrgARXwz2UHYbfYRUgdvdDlB1qqdfb3TZ3u0VQrX90FFCzWLuJwKPg8eeGzX05aPJA==","shasum":"a80c6934e22fb7baed1ca4a7fc09bc8a3ff8b933","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.1.tgz","fileCount":8,"unpackedSize":13869,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdu/tRCRA9TVsSAnZWagAAX5UP/icqBK6dITpBbqL6cQlO\nl9TjQcLBi6GJ1lq3pdPPWZo3dmESYkIRiw+7xtaMpmu4AeMtrkjGvkUbdnC3\nsmRBB4+OjDHYnNgtGwSf9KoQFqA+GjKJj8DFfbLNvQ24puRJ6S0q4TEWbMok\nYXCGn+XkFfwInt6FJkHIkHEjpbJThVYf827o9xWMrXPYDjSb13VT75mJsL2z\nOqfxCikgq1OiFrf2BY+z+6wyJ8KFzbAfJUVZnaFIKKfsn9mhYTXRYOK79MXj\nAIe0jgG07I/T95CUgigmCie8OjSjsQvS+WzHnk2SMbCFUQDZOxAheB7qzoBE\nJAKSYZR9TPWx4u4BGbZ4oTiHxf3eRV8HKp83TeXFR++X6FxMUY6wECz5ZuJ/\nmtJMUwKP+jHCFduUWB3tlmZuv0+htbCm9b7iA+sVWlHGykliB/LgrG2KfAIk\np3yay7Bv+7uvBkmzPYbJs0COa2I80+8E1L5FvsxpOGo/VCkH5ruJ4IS4XRHh\nCpJxFw1OS12tSMfOQ87zoU7dFH4NSp9ZEnsoVvC/OCQU0KbOk5xTDQV0/eHO\nu287GT/PWEkcYLs0PDock/ox06mXgb0qZGgXek9mFJPrpFeQJXkfp28G5Pbe\n6P7k0jPiaiB5OuRbsgyoPjZzvtyclt/SzIsCNj9Sd1YAVnNA+IogJGLz6MHb\nR+Ru\r\n=hDy0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBILeHI+2ax2+ClBeZQEpaggVy9IijFq1V1XPZKpM1HaAiEA3uy//UK2f/Tvzrgg/oIWgfNqA4jO9byoEsVALyOVezc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.1_1572600657434_0.19786567491083495"},"_hasShrinkwrap":false},"0.10.2-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.0+b5a235b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b5a235b9e1eec103341354d152fc86862912cd41","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-i6aZUJR0cJ0Pf9oTPpcTiY4k8DyHACgeMz2Qlq+XdbzkFngjdsUZe7r1GDYR5XKbmKTFrzGtXfx5kgxSB4mivA==","shasum":"5cd4c9e09247580541777bbeeb247f83b73454d5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.0.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvBskCRA9TVsSAnZWagAABsYP/AnDfS7/OnWp14qG42qs\ne08Wd0VdNfjWaVai5A16ol+qSO0+79YwokkdragblnvR/y/SFP60bwcELkvL\nUOlOuAJVX0hYfFCJ+gGAy/uukMHYgIuJODtxodmiXklWopVOJ6xVCp31Y5YN\nlwv1x1YFokfta5wInyWbmxUtDSy5nemmdGWOLSaX+LxVsEOl/xr9R981GnwO\nAju1+7gzy+ghhCMkssrPup6LZfdQlQmkofa529hb3e4wFUsDVWe/7MEO+0d3\np2YdLoSBaXVUqKGxVZzcFc2FtzrsdyavRt9WArZPCy3jpsfzB8lwmx4VAy0+\nQKzyJzHyYbP6XFFxAYWpgths/U7LqBU8lGoawifwOeiq2r1/W043OdpMG6ye\nX2iESaLKCX6d1t5dw7S6hpp0HwnAqDBkMYa5MOBa2Jn4aZtYdkd3BpMUK1KN\nDMttd8Tzz2XFUfocn7x8AiiXbBLbf4GQKeGEwMsVHgf3dqQNSFoDoAwQkQk7\nEjn9SNGjFgZjhTN+XU+dia9kQd+8ffacDLv38vTqL/1pgjiTAcdrdzvW9j3Q\nbIKkA5VD6tJbcVZMTWmx9NUpDRcFKWKURNd51xmWSjhelP4qUQZzBeIzxmy0\nzJcZdkeF6voQDplOaDWgBjWp+CbpdhrVIO9HD23O5XfdoUD5Tabup6qLdORD\nGRHf\r\n=eQUV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHbp2CH4rPvgx2t8DUdxLCXcie3dV93KjniOECkH0EqyAiEA5vypLogCfDQHy4KhtAzsoTaYVuIagBTfnzwaleLmAiA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.0_1572608803672_0.8118053178086984"},"_hasShrinkwrap":false},"0.10.2-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.1+be74df1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"be74df1b05b16e41c2946c291ffae3bf2af77371","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Tlri10XPCBrFd9BiH3OVZ0sdpbfP9VUgjYn3SE8kjK6AaJHy2RaI1bVD1U0eif5Ri1N1ON1hFdGAgnB3hwckNw==","shasum":"edaa18eccf8f5c61d254d659bcafbbf56c6cd2de","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.1.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvBypCRA9TVsSAnZWagAAQo8P/07jzRjN4E0+M0TlM34L\njfcH3cqtPTU4wAIomJ4M8iqiT9U4X0GUu/J/vLFZ1vfk3rBYH6AXN/HzEfoD\nbqFCQSG7gRxPFgLSeXjTcewcAsTyT6zSrf90MoQx6FlqXFOjZwdrxCNV1K74\nBhHElqIMOt4xl0Yu8KGCgVXcdUU406dpzTgpGz82Y5LVTBfa7n+ZLC4CAIa1\nhouAV4Si7j3H4tPqUqAwwbBwhaQc0Mk6xHZFC0SAqBZoaZstILVHrURCeluq\ni7ZahFGABJajY95dr4F/Ohz0SxlMmooBZcGyRIuD0dacEWm8hGBqcun1BzOw\nusqShxHUvMd9hpJa9BXUu+LKYkNy/cL2zPajH6b1PpETldmKb6vuK3SjIObB\ndGtiBb+ZY293SRwd2xFaSZ2l1A894dwQHo7CpXfBvbbNA1315jWRsabGljwh\n/Kgkap+4c8Nk1L5SpfspRCxrO0U8/sOM1UsCWY4qcpbUFYRi20aaVNHgK5fu\nKTiAIHkpHDIbRz5EXdRbKUrFNjGirtPDq8Fyxu0Z3lO/cVemjYAcqMFHn8sH\nDQVaG6Bd4VP3Zfyo1d+Awnxh3eMM2Vl8u9WK4PMMlzoyYZsFsp2WlkCJ15wQ\nx0bqOLA1rBLiPASG4Mo3eaDkq4gkhkDkLtx2o2G5obxQ5h5sNTsl/7ZPtZmR\nfSpI\r\n=2TmO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGbU05SijwX45c47VHCKQ94ROItUCmojqLKpc/siOmZNAiEAt0zq42Hv+aqW7UL6ANNm74xS6BC+3QwpDYSmEJxH7Xo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.1_1572609192853_0.3035478824473956"},"_hasShrinkwrap":false},"0.10.2-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.2+b11136a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b11136a94f700997aafafe0de24dd54418481470","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-M7QKwQBOuq3E6zeeWZJO5sEAG4xnsz/oIP+yJ/1BAXmLdvsnkn/Wwl8ZV0GI4uJABz3f7Rj+A/BEBfk0NfJ5Wg==","shasum":"914d29e658772695fd2b9096196a975daadf889e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.2.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvB1hCRA9TVsSAnZWagAANRkP/3+vDJI/K8qDStQvzpkd\n0z1kzAyGhBuscAmDwbYj99Y8DWG1dcRdARfVS60ecIUTS0o1xgk0XVpZQ/13\nqnnv+wzzy9D+9YILCW9xvZu2jUQd85Mbv7wY1cSNMornocP36ol+qwtu+um8\nou5kZgWvkick1jYwqAEF2d/qmgIsCnTsfs4OgpJy8L8ajY37aPpuOYH44Kbd\nAaM5p222KH/SzWG8ywyqJhOEsMDfpNM8HI2gQUflpCrMbVD42xDSxQTZmR8c\n8roWY1uLzxQH50sUpNpTkdRXVpq/9Odr77/6vrIYX8JPRif02LVcUz3XhvTo\neg83TNbc+OKeYYLP/98ImPrn+ihpM0DM1Tb8by6qTeKmCozHWnvmz11d+0Y/\no8uICsuEHgZv6qFz3WCfRjR8nkyDkh1kI+5abVaaAxfrkBNiz39ayQo5HqyS\nvqCp7Uj70jfYKl+PdOoN0xXTCb7ighTfUUoTOsfNw4aeCeSNotOdYmjlWAC8\n0luR9G/rytMxTwZgRQgLI+J7/Pv9RiCNQixlmo4le/F+1QgIye4JLektzqbj\nQ7N6iUzmO9B48g5cCVzN86WM9qQA42PQScDGOmfx7VrS8nMKohCvihjHCszi\nT4XcTnd0OZxe6z9DPZkhJqpTDqycBlwHR/AFkb4VuoTSYRHk4dfq/rAme73o\nb1w8\r\n=vqcr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICnCrAapMi2j3nNHUkC660h5o89kRcDHVi8VUGIAA0ybAiEA3dP/krUGR3dlsr2HxzgTrfIFj8sJ9aA6/vftEqRNGfE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.2_1572609377326_0.30683327622112766"},"_hasShrinkwrap":false},"0.10.2-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.4+60d80d9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"60d80d9837dcf6a91aa5dc0d5e70b5ab183740c9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-g/Votou77EtOaQPkTgzCq4hbZtxtrJu9okaCr4+r1IY9c+Fz6wXsM6/V6UPOVoCFfZTpP6SHdBvu7mmkUF9J1g==","shasum":"f6836004b171da85928ebbc4ffa492c0a94bf3f3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.4.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvB5+CRA9TVsSAnZWagAA5uAQAIaxJejHV/xWVb+mJzy8\n5EcbvTDxUnZ8rHzHSbmgiNMOJCnVNPxjgfrlNCZ1lw6KvKOOettOgOBmKrdc\nttksxgoXhnKebmNILgddtvurT1PoIiQZ1StiQSS2oy1x168+v7gSSykvApgh\nIzhZKKGv+vuK5Inb4/MOxbRAmbtDRGd2piRqflzj72G1m+NYEjkT2hEVPH6d\nGYIsxA52qu99zpH868cCOFZAVHDSolXsQiWPg1PQs9ti22DpBvaeND8KiXNa\nAv0Ustxc4tfPVeIeWrj2HHSbhrEIYeyGOVHA/D/+0UFsCWjkKngyXSaJveIS\ndwkjh7Qmn911pI1zq9HtvPtqd02+SJPMqZ8m457N73dUCI0+XRXQZ1JZ4oCF\nZKxAgIOXOSenXea7dNVTasgVmJCOyo0nkuDkHr7nK3ViAJrVcedyAsvHGyOl\nFNqdi8zijziWkU28rZmD5rtIet2KI+pFFcNfOl23GxuiqghTgZ3Lkht2AEkN\n4pNiAiehI4Jr1EMXudzgOmSp8s7wzqPltk0ZnPYZ8q34oXy19Ig9cAKK+HhZ\nCKB7RbbSSxKJt9nWmfgN1uePnTc2RFI57FkgGghqrrlPFdKOdsBhErNb4pgI\nrl2EgnjuIeuW5hl6mqBlqJK2UiyH7FAgf6Q61mwUgThM8iiIJ6WY7N3ZNV/H\nGbfF\r\n=AygA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIE0RvSUGXfUAQGbaWctQTLeYz41NKdMW2w3aIAyEm8UfAiEAj+/+8AULDYm+VR2lO+pNYSHk6Za9lZeOAJAFFMVHjIo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.4_1572609662414_0.9804613896018146"},"_hasShrinkwrap":false},"0.10.2-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.5+b993847"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b99384732aa411b19b6f546ba2c756d6280d0e38","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-lmGqU22uVKQ1mFXSSWGRyWtpT9VpW20bkHUJg405kWrk6UajACtXDszQwDo6hsCE9p9eOHpgGndvB6yyRk14QA==","shasum":"3ed83730a042d2525c84f576e57f998ef51178d6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.5.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCFGCRA9TVsSAnZWagAAoPAQAJZN+3xgLWd1ynnIoHDf\nBi5VAo1+/N+NGgWzOQtnb2h+aRuesQpM/GLT8ghqerM/1T2dd5uZXSirf2mi\nttHYEWl01mds77SWjSRFXz5aIFDHMrlem1/YEGjksxgqt6XRUBYfpc00HNCa\n4WWXsFKmDcusGEiE7xNt//x9TBYm7fKxQI0lXLPkh7uG8+P8ak/rUe+X/l1x\n0LaELYA1WIZuNUP2LjtzYRvjT8qLA9F+5dKLm9Dx7/Vf4C3AklepOi9fLhe0\nulVbV5C85Di+udRvUJg/GYWQYXxW0V6ExLZOFr05chyY4wqZ0HyKr2vWJ427\nt2/VLyRKJASHKDU5+9QOC2wMAwFo++DReRdXAAEV6fx2VC1sDbIGRWMOt6zS\n190Vf3ES+vESBTCu6hT3o6zqsI0GIBqMr73xG/oa0K7wzUmTs5L2dzxM8TlL\nFZcm9Y84rLDTmGMHYpseuaxhHnhIqKcFCsDhOLb0scuKbbCqHk3pMcMjGZi5\nlpQAPKk16kgTm+EjZtnWgg0fNZBJK7RFbvW4xW+wtkaCweBZ2U1cOm9yP1Pa\nu3TAjidUmpbcNtRvbu/a0VSZHLo3UkIVlDuuTOCHFwjAE0+pgsUbslF+GwE9\nFR/aRuGjVVqvT/HH5Ez1Mh0TRFj1yxNjx1mR5MxrIhgIJT+iy4BtUacMfO99\n7mQr\r\n=PTA5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG7CvzOXw5bSvuZVFv6kdAxyhWYDuwWP/3NTrB6cXdPVAiBkhBaCcsNUOuJtjEzVKTCxJ+V1eNgxaD49QF1DkH1uUA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.5_1572610374188_0.22990890040823286"},"_hasShrinkwrap":false},"0.10.2-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.6+8e1d0c7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8e1d0c726f10013b7ff662d2d8551ed9fad70b12","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-aE0SfMkWlQ/Ge6ZfXcfD7uFJ2ULN1/m/cA89MEXk4DFisBLo77ubma23Slan+ZeX4cJ9f83W9wQtIt886IXK5g==","shasum":"1d9ed50acf9dff3adc3e70251b24aa07bbbe2b04","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.6.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCGoCRA9TVsSAnZWagAAhfYP/1Potu6sSww2B9TVzwe8\nG2BtorLKQxxZZlCB5dqtMZWzTSnnhX1YWZQRUmCbwZvvWBG8f6OeIlyecLX/\n7EuF5vyURuxoZtDdI539SbOHQeOZxQIVz8h3MFo1kLmtqMrFP08Ye5gIx9la\nUULIqQppHCRHuhOS85RqBr+tb1rxWWuOCjsm034yyVqZtwLPYbQkshwET1lW\nLsMljy+BZHudPR/q/BJ5UiA4fCp7IV9crQilOK0OBshNPvxm3rCOr0JbrLzW\nPFzO0zheqziJSkcZpFTBs5MNnUc8RsVhCdQ89KblI4aSaKMaoe+/Vy8SMvKH\nABI9I5PiyxnGjt1N6/iEIwBoVFVO+Zl3/EkYBIRrddCZHCqqOe+M4S2fNi6o\ndKoy2s6X5aq6Q2CYPIWsvN9kF+Jukz17J/npxBWd2gFajG1SoIh0VkGhgIdX\nD32qAssOh4l3IpLdUEbwezJ+hA+HALo55yP9RQJgtn/X3d2yE+YdRMXWg3rt\nLsYCwZqpK+Jdn9ryRnIrcOOk357br9+4YrPP3v3jxxfBrdkmDfOI+SEE6ANg\nC+UzZa5btJBZsHnDx+DNX6n/+jiNx2ouqIJPAeSWwvAks91+o0l6vTsGPkII\nmCChzzhybBd/NJ9PUInTZsMOA5c13CmK5/GHhyw0F1gstR87+BrTiXwlm1nW\nYxcr\r\n=BMvN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDMlW0rExPBuViYq0nQIuPDpbfk4wae9n8VNcQfo/cfdwIhAOBrMhyckFVtbIS5kjoBkbh++lFKTMTmYjHV7p7f9+9f"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.6_1572610471435_0.9301351904083099"},"_hasShrinkwrap":false},"0.10.2-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.7+7b76dff"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7b76dff0b63b9ccc8169a5c056f0c53dd3345dbf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-l0lpnJtkJZMtqVz/UDBDF8aNYI0xs9le0BjZSJkV/tbInTqX4QcLfL64AhjrOz2glYXwOlnKD856NGIp6HxxmA==","shasum":"92c3f3c511cf5fe9b466b6d624c7ec7743814666","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.7.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCL+CRA9TVsSAnZWagAA1UAP/2asgGosl1LdgdYx0GJH\ncju0LELRkqhQffg7tFFZTkAMl9Q9AEe4Bvx8J0lFHODaZFDB48Exl4aumV2v\nmew4sECkvg40LCya+Dv/LbDeAv1qBH24MFDUXg0UdtQS3eghgKrjL+TY2Fyj\nE51d3PKLxvfDZbuCdTJRFQigh9d0q3UbqRn3bkIjyAvapgg169OX192eDhFI\nosY8eylsR7iSIrYY34GX3WCN96zOCJB5GIig7l2KOl81K3YkSXz4LmbL1Bcm\noKkL1eXDn9+wz6cis8pi7isJsoeGuKGmGDsbKc6Oql6aw2m22186OMpqsGtN\nT8BhnzcQ7zd0Yn4Xauqbp0CfnytqW3RnLqqtAztrz93oRo44b01s5x/UcRY5\n5W2wjWLOIoD/ZVSegX45KXRchOtlAb+F+ejoc9X+QK/OBLqeRAMY45QInCAW\nGROrp1e4htp68ZH8zO22Ds50Q5hNZZI6iaSIQkcXWX4B4CmI2NoFpf8WCfJv\nWpBomWes/klh2qldm0IxEfh082GYyE6o9fIvFBCRDfZWmM4hmcDCZzp0dhq/\nhfFBZLgKFdphWw0DahDtkDwgzrCT0vymxDU7h3gj9PsDyAkLL48SePh9763r\nyIOmWRHg/yZSplaxpFMFlNujzrSSv/7j/U5MxTwAawZdtGCtn4x168V89aca\nzp6q\r\n=NJpe\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBtWVo7Uo4iYpnhEOqWLbY0aEx/hMncXAVPLJ9xGJOX4AiEAklWWP1Lno/C+HzpKqj1EIN5zjG2LNOaJBOc8+ZDKL78="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.7_1572610813885_0.10148541716214443"},"_hasShrinkwrap":false},"0.10.2-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.8+f0cbb15"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f0cbb1593b46d05b530d44766138ecf9aec5005f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Jkr5r4favFKFVYnLkc3Jww3lfEVa/x2oiJEBcLML2Y6bRr4udnZS2biWSUzhoq52KLHQMV+T+47nCJI9RnjXbg==","shasum":"14564c7af9fcad95d6a9a17a16224e84e5f0a720","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.8.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCTxCRA9TVsSAnZWagAA4X0P/j5eMNue2hLxMxG8HIYL\nz7dz6UqstATSlc1zh2LbZIksMecfg5K/jfp5KIFw+gGKgm36Sm1aHB75Ji4o\npuBZjyQ0iPgG+7cTMS7X/3msmyKPHCrCLghW7NxwLnJHamTEEAbl+GBF0aOa\nXWzF6/ZailcRWKn7+4S0gV2yoWeoTjgthibUFwOky5cS/whJAFjYjqQmxP8w\n1HUW3tK/OhjeZEvbPn41ix1BlLBHu+y6fBFq3pX9Q+PEH+6adLGVdFaJKAtb\n0/z9/E4/llipfH9j4PSBDVzJ0vj46qhluZ7ftuYp0GNYIkJHakFM7RsRQGZ4\nMkEN6/WVUVPNrXdPuVqJCsAAKdK9zIOgiMDdX1v9UeVA0nVljURS2MxY76TT\nbtwanyW6dJ5rh/ZTeJdthaYMxx/cVJzZmzoXTMW2VE8o8Rgp5P7kaacs2+Lt\n7fcGcMPYwGD9tJFKzCzRPiwSZiqJ9IFgvLmQnJbvR4iAqWibVritVzRGsPdK\nyQibCO/kAknTB30XW+vJ3Q6Y+2f/SvM411vaAHos4hO4ZuFvol28i7TFycQ8\nzC5PsPzm5ia7pDlLc9ItpSDqgJcgBaeeGCQtZisJOEn7Xu4TcLobngB8b6y5\n20uBmvfxYTrcyIEdgmYvne/8UtUpWMKLjsL4dvAvo85fNEKkJWtmbrVMO66I\nT1k2\r\n=Yfek\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIElWuhgKr6Mc55Pq53s6EXss1wzCJKDtDxCQbbqLCA9XAiEA9hPTMbwYGiARyjmu8OaxwcwTyKhUB2Yy8bYYlgUVYX0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.8_1572611313462_0.23257669017978477"},"_hasShrinkwrap":false},"0.10.2-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.9+bb9eeff"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"bb9eeffd6fce6c2b94d81308cfad777142e506c0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0keNH4hlcomnzASEJzUA0obChsZ+IIQXFVg+C/4wP9P9MWgsgeC9eFbom5pyFg2Huy6Fhe6QcXfJyMBhIdMY+g==","shasum":"15459a24a9e52f0932bdbc3a0ac2dd0ca6236025","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.9.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCVlCRA9TVsSAnZWagAAj6kP/1oF+DuRqaMicTH7r/KZ\nRB/KS0bfWXG4kAuzvDMUiGBCNcJZoWR58sQ4SiBw3riih8ouXL3jALJryYeQ\na0nRoqOpImQs1poGi15KrtmArDNlX09BhiCUUJBH/Z3QuQTMxfH2JTCmtXJX\nIbaB5YBVesRJtX3jJoano88lB6BDnlsBeXGIrYMJLxiCu0/rM3ga+ofU2sDH\n3db/qv0DVayWn3x4oj+/cSx81yM79vhxK863B3MTNv31uEcxMGgL2DvSxpvR\nlk4lOvtXxIiFJglxwHe5aJYWw8Sci618jyZs3xAvstT8tcW/23uGjTttuml7\nynpL/yb+yoNZG4SM2LDzebcc+U3Z41Dz/+Z52kN7PRIhHpjrnPeRRwHxVFV8\ncm383InnbXUuziCwKjXrK97dUxUfTd0l+8lfgQDYRzXTtLyrJc03O7vCy9D0\nKF8lBkSea/vufjJigK9VMOH19Nz/iN5QeU4qZPhuhCnK24bnRVIUYjwbt2H1\nrdWhR7zh0XrXGRpWZKgEtrIcGeYiCNuwqGx2RMqMjIF3riv2s6EtegeVhZzn\nGuaH2ltJF4Yc80jEq284QmwOJovPH4kxptI7dVj0WWNdGN1vYSIzxGVaAOOS\nBr8ksq8y1bZLwLD0ri6puOJ5am9Wkx8Ryads946ewb+jp9XEC7Gt6gZjNqS/\nJGCk\r\n=caO8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDhuwKecgoibQtkfDqsLV77H8WbjcB9TaavtuXcATZCuAiAgq/U65SH++0xh2vXn5xVVwOpjZo+SQNslZcBKV4A0wg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.9_1572611428811_0.9993825788142732"},"_hasShrinkwrap":false},"0.10.2-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.10+302f30b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"302f30b7c943fab1ff43a179a739da66a53ec293","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-WbVjETcg/mdj9BjpP8k06ax0ueOEKZ31RCTM6l31eSMw+1wGOdp6RARhxHFRpNtBGTasjL065suNnwWJL3LSww==","shasum":"e90dc9f1dc951cb33bdedeeebd8e1076c0f6ee8c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.10.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCXwCRA9TVsSAnZWagAA8HEP/ixTnXY7IPPKCcEa4K/r\nLxS4f9COnKpUA5sNaof78qHNPnnhqe6Ej8vIgQOyF0cDVYa6eqcdr4MliaB2\nZ+QVBTYNZw0iCLkkwZb/2pBF7N3mIIOst8vF5UyoApqJZckUVQSZJTYUEI0k\nQsi0/aQobqfBafubtfoJvIGrWKiX6pR2zNzLEqV0TgNDZ4TB2kaO1JhuJOtz\n3F5Ti/9fERpnnydsWM2V2WK6loMd9pVCVNP72ojIbYVQ6RLdEy52TqZdsAcj\nM1LfqMzIDdUY9H4GH3C9geUKhEx6PHwFPshZHgfgYKmdBsys7WKBSWrlwRue\nAS+kR49iLx1KehH9fd4NTYBs6pk9DFzHfKxzGLMWoe6Ds3CD+GK8Sd5E7vaR\nWWKpkCjM2mw7garA+wLediF7pObnE/PM5IobczkdrVR2c+TjxVKj9thj/bN0\nSWHi/VWWGUcSTcGfL2GHM7dWSBM+gRT2aCSGvBkT5Yd9OZZaKoIhUc3gq/Mo\nxsoFZjsoUzLtGAF2Tr25tCznmCRGNTBVeqeH5rD+7YfCeJNonrhBGqRdvGrT\nqm8g7zpRZKq0FlDi+zxlGc96UQRFhg7knPWazzQBVbdgN3ZeD+5aoY6hkv09\nu7qkm0X5rZgWy/rMYK4FHtyefTAgEoqDPVi0nEZEXW9QKT2QPvMt80evy0IH\nekvD\r\n=2upl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC1jtvZkNcRXnsBA/vKcLSbqGZH4oyITG6ijRVmgRAOsgIgQg0ByXRYwKsSLW0j6XBxtf7DWy0r1tm75jeUKQxa0NQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.10_1572611567622_0.597554643103291"},"_hasShrinkwrap":false},"0.10.2-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.11+ccb780c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ccb780c15109e74b7858c33fdf7413652ba3a33e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-W1GT4fZYMzJ3BU3S10Ls1zSY7qHFaVYi7LAIL7noHoa/X/pS4g2f1Ss8OTNadc1qOoh7p9RqJcNS69knrk9myQ==","shasum":"b7729d43e14941d3b1d568e204dbc64fdd4a5d74","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.11.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCYxCRA9TVsSAnZWagAA2b4P/iRUHbLU6+k1NLVLe1nQ\nD7Lf3NjlEN7y6DN2Qban0vFwLMGVAuwMruxdiEv6GlQFN6IMaZh0DmqYYGMR\n0nw/8hqMsQ2nspaWUTYkEUgtMvSPKE7DNx5VJm/0MzAhEFZ3/fS9qu/U4ltO\nHXJymdH0NkEo9+5fO7qxGytlEpm2unTyRC+qta3+e+YxBlnN8O5WsaXKRAm+\nu+o64tIHhTmk1owPUDVttpLOCHh53SlCDgW/XorBK+pJQeMDQ14HHnfi39bo\nR7yr4f9Gl8PAlyujoYG6rKbVx2oOyIwwDE7dgXhckTrgQGogJ0UEAFr9sgeX\n4UkZQEf2nSF5OilAAL5DnEAQaxSxitY/Zvm5JxL9+SKgfrF7tzHYpvFmtx1S\nBqR9759p/bg2jD69B8+ds8ylApuOgHWfZEooB5PZQz6/Qyfs/bhleQotYK69\n5MI4i+5p0L5ct3b6aPRdsBd3VprV8ciL7tbk0fkWxPQi/up5zEkoFLRVwKHx\ntKqMXOGulSkzIMMBkDoQ6z+e2Dc3qQFC90AH4aFNTwXvEM7qKdy18I9ROnlm\n16GumcR7hcyNSeXhA9KfS9MIg6jEIFg03lGyiidU8UjM3ouH2UBnnsgn50qD\nu3bLIWhFPDd6UythfFqDiuiHVTuhYRMy6BQNqECsgW3LT+ASsaItwbVZ76No\nyB4a\r\n=DqPS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF6+UByZOFhMkOpRa26mEIrtOx5JY2h2DgJHLHXGQwbPAiEAnnKCM7H1B7Q/LbDwMP40DdC6UNxJYLftIz7Kha/HFkk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.11_1572611632874_0.09841483244016991"},"_hasShrinkwrap":false},"0.10.2-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.12+470872c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"470872ccdba8d1355d154d4e6dac0f23e5b8be55","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-syEVabJWox3kdjMMAq6oW0v0ZF9+G1To8QYRiuwJ3CVVhEtnL5GnvcXKzSZuZ4I/eRKOW8iIqmMByjhohawSHQ==","shasum":"9ae249bf2f6860c859c8a74219d741914d8a6d0f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.12.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCcuCRA9TVsSAnZWagAA7NkP/AsSDWln1KUocMGdXoW3\nMDOBPFN/w6f8D8Czxngp8vDN3/L3QtAunNJX5ttkcTX9xBkn2v1HJGnih6+m\nBbYcWwzFZ8yQOdaaEwh0YS+/fjqbZfFAk7MGs0o0z/HFj6tdu9erjwptbn00\nP6EuamuftkKrRJSNRx+OQAyYNbWBxLBm2J5BhKtiKcE9n4p98wtke0Uj5rui\nO1hzgZqGkIK0LlfV7Cmb/lnXaJKnUaSQ5AmTNIA4oz2Kue0k5gTBJnR3OoMn\nEovw+j1BFmSiU1meyFfIyCLL/BtKtKZ9LjJhq8SdKX3cHlkaKxMVvPCFYNUY\n6dvKLFD95I8+aC85yc2WS8LUQY5Ya9OiqBU3Bm5xbYMw2mBqa8z0CrkRafxN\nrz78+Camhb59hDzi0Vi4yRfi8p4lVE2yxKTDlZWU935SEnZLBBw98okLWgzK\nTu12uye2p0v8zghwEiJ6BbjFxj+PD77Gw3cEVcsnrkiCn0ZmoIPs37sbqXSZ\nvEpNF+CBhTSW6/1yE+jcy0rp+XVMWtAPEWFGHGQLw7ZAsaoSUt8Qa1FXmzb1\n7BjVev9inf2uwtQ1Zm/2r7qK6sNITF+JbWFGEfSqz6OodcYDnisonlDYxx7l\nE6Xth/KKKDlRq9zeX7+bSlvmNSHX1REKVcJHGRLLj9FuEQr7YulESh4FKjue\nFI4z\r\n=TFhi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDzkxjXO3bvCjS/yYe6wZ4zU0/EqdpNZ5ywtXZ+PTN/hwIgeHkW6y8l74HToBNiu/1wR3nasWRNkmjgr0uevdKAsfA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.12_1572611885919_0.5826912829681783"},"_hasShrinkwrap":false},"0.10.2-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.13+49a8ccd"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"49a8ccd0ec0e4de7b9a394c78b452833f404479e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-OPhT2evGzi0rtogQ6FyQGqpjo/s6W3NwWhpz/Fd9bNjZoHzi1P0ta3670D/OuuXa+6w7MR/Q7Yxg/gaDkPXQvQ==","shasum":"aea99ae72cda43d29f84c7e16d5b73a88429d211","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.13.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvChvCRA9TVsSAnZWagAA7vwQAInPnCv6dol3nLosjMFL\nnIw6pNxORrbPtsVc7VuXmN1MJoNoQGk7YfmebxrTE65FHx/LaTMP7PeLwwEy\n6HJbCz0HcCatTIHtomrhisY3w0LyZ6eQWX/48x4EAG9MM/BHAaOMDkq2XgnN\nw3bxgIPvZ5gPSv5f+C30MRo9EOTBr91zCDgboFMCMOnIHl6Yu0BwwA1R2y1w\nP+Cy60lSiHi3lVVdYEiHpGQFrl6xLj1aCIMUwFlJEiWx0vYOQ/N5T4E4nUwg\nLhT5cQvMbC/TbsGLFWctxDrQpWZrfV2N1lhFrOm+Mp518e0rNsJ4w83INMIn\n1jaZK/HAyguI1R77AbqJWC0pMpGhLzSI0OIccRvSNKrjiHPjyczelSDXvsfD\nw7t6MlHLRRFILYZDc+lgFXx74TBtL9f6yhbjze4fPhBKE3jrOFCIUEG/4K9R\n42DxlyWBHs5GbhuEUV1HJr7W7gD7CLISrJ2DylyMWO2HHZx4HT2p5YUXN3yt\nAa/cxDhH43WszwBl1JeH2SP3jTAC2hSWQvLYpYqOK/+QiuouYHwY0s8bzAYP\ncFbmiJ39B5GnF8CYL7vaV922FZKHh7Qd+bFNCh6FH4466K7kGHHead0a0Zx1\nLIAhFJR96Q2Eg8xanqUfcePdb8nBFnc/JA+fBbSCTPfdzgVlGpEKLAEka53o\nXjxJ\r\n=w5SR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC2WusAyC2r+noc9NjYVe7BDiE8Jq2CTeAfwTj+Gq7uQQIhAJAWP/+9jGqWPKTCdyeFEwSXjyNLfbqh+4rPhICA7qe7"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.13_1572612206785_0.23179835875354415"},"_hasShrinkwrap":false},"0.10.2-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.14+06a4730"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"06a47306aa671f906ecf64c83838953e41850454","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-e+ogZRru/FO9wHw+pIjHYJQenTNLSEKVdXFWRSYyfPhSgX2PVI9W2Ykf/minZMVb+CsI5fqFn0xXfUZurd8lSQ==","shasum":"025cfbfdba56b001eb05c1b0d4626902cc5f0ae3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.14.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCp9CRA9TVsSAnZWagAAsBkQAITlZmEjSZ3noZyLv6Of\nsWT7oUXc4zw4rtZjA1qcOedZEpC6al6ZOqPWHtjeEZH3TfOXO/odRuwQQF0c\n2DyvLon8kJu1sADDIIGTG6iatYiWfwQabpTFOvixQ7kiKWYZ691J/yXuKuhZ\n82AtkIUL2n3dcfhJLzPCYfrCffzfqhpA9+uQ/8dfNy8DNkkKfEwW8fk54BVz\nx2BOadm82RtrD88799fU+W+65dpYdwtm91Sd9pmDSup9SuHCRN3HG5/X4P8F\nHEsILRt4UVofo4n6i1mVeHkFsUF8NYra33NawCWAiMjZz4O6NJJU0WwcNsZP\nIqU8RcckzER6VuBSuYUf7peu2vwKGHZdwzk2iA1OnQWK+ypUqrRyDSXW3QFd\nPfQH6LqA0wizxS+ITbtjR6k7GhgjZvLl+fecLvCD4a4gkr4/dKwtdCCF61C5\nbuwZFvIEkn6jqQ4/Id6/8T5XXKyU3NvrysUWmCgDxbo5bvwidf9D+0RnauIW\nluL9bTa3Jrpt+P5mJ23Fp4wLUa31V7+EFMUnAtR3/C190faO7lx3ZNeCuZw4\nHzndHWFpj/gEnHA1KzX+2jXDeFDaz3Af9VvmPMJtOvDwOfWO6MkO5XlMS0Cu\nH57/QAfivLEMyW2apCosQeLrgZ4eXvslGHhH8y9uWrz8lbu40LCRIqRSG31c\nETpV\r\n=+9HN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBwcvs/iHAbAHqlqlusY2YR+3EuTYUoseUlL41eBd8jiAiEA+U+gh+CiEge7q8/gUPTQBaPwchEMCMC5lIwplncnKsY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.14_1572612732702_0.006583290424527322"},"_hasShrinkwrap":false},"0.10.2-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.15+2d2237c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2d2237cd782da32c9c8aed871e8e1d8eb1381520","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-R2v71y5Y0we6/+m5U8QTZy1KUo3un1u8PNjdPM3D7TYcoRYz7Zy1kCDb32PadYjLFVyxdGhsGLWF4HLnqcqRGQ==","shasum":"ecf74e69b9d8d5eeb8660681408b0dc25a4c8318","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.15.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCsYCRA9TVsSAnZWagAAdw4QAJCVu6/fpZW4Vhx7pVfh\nUIJJwLy9DJ9sjNT9bQ4CGT4DQcB8g3OsLWVH+FFvibFuQQpNIeqi2DDN7UxW\njACoaC/hnEQBr7RMDbcuibub0iBJoEKp1k41J4hsKD4mhY0gzwDjgDK4vnN6\nKOEsn/enOUkXshmoBZFYetIHJXWyY7PVO3GQQN5aiVIMCd4llVl1gIj3wHzc\n4t4xm9DsbnUW5FX2SAmaVkhna+IegfekYyVZMbAVz4Tq97kYFfSXcW9tCaZa\nYdVhpfz6/HFzYKZs0vvNWLVnX9FkCClWFMv9Zs2sEJtn1r0xfH95zC1l9CJj\n3OwCfgSuBsJYLxvgbQeaMQ6FQeJaxPJtF4jObDBOwvkwTxN3arH/euvg2Btr\na0iiRdS0iTcaZbBKULFaFq2Ph7AzmDz4FpfKPi5fgFmMdNrcgwWcS/k84J8y\nb7H2Cr+5B0ncFJ1tCAOj4sQCLD4f1TUGLA6dFrpc9wdMGu0ffG8n4Y+Oghze\n84QU8vxSLL75XHkFbZkiUn054C2REYMprxAfT11A5jyVc+vLFGuT+ErGwINe\nojhNM0tXnjJ5pmasjISc4zUVWVdBr7BwCapshRm6gesxxSR4DTtgLvKyCC8R\ntPK18gxWUB91pFRUS03v2CO3+3JNWya5wnzDT/JuIcQN4pfMxjSJ/jnfUhqq\nQUSK\r\n=w/Kq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCX+rpfGw1rddloZeW0OGnCWNxbOoNuoyVxP8p0QR1+BAIgebnKHHkFm/1Vh2KhxCPrnsfN56FMEFXuqtlQkCODa7k="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.15_1572612888390_0.04037122689492345"},"_hasShrinkwrap":false},"0.10.2-alpha.16":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.16+0f6c46d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0f6c46dbe01a48b82a9b8c470b4bf7ae6c65c148","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.16","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-K4wtP7KALIU+d2o5iAp4WeBjNyWueYsv2h2ip6J3SI3IYYKc0B+tXFZOSkWAjAU78FnCoIfqy0iTqeuSIfh17w==","shasum":"aabe6a59c0b97ba1f3391bbe5e085d1945705720","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.16.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCv4CRA9TVsSAnZWagAA3wkP+wd/xL5zSGcRPQTCtqZN\nKvZhNOqFAbWoeXOeZhjjcdgl5+VEJ5ZfWW+56vkhBF9eQOD6giu427UV4/E4\noBWR70o3XVeu6o3sssTUaP6fNd1U6Bz4nXVXw/NyeqVo0xLvi05LQZGSrT/a\nWb+gBqhVyAVLsaQucb0TM39VHt+vD8UB2ZQ7qiTsmXbp0QE8+Pa9JloObjeU\n3jju2BB5XkGlKEkicvyEyHvTKf6ehYlXH7ytV95orSTqz01t6s4usO7TZP24\nHf+tOlgZwaQ1sDTOBmC2wL9sWNvSb14IEJhCW/u4rtQ3zZJwlgUG8abmF4vZ\n5SpgYcwXvbl9x3vzN/7hqNKTlK2nz61l0IS50nMKeyy5XdfYKEBMjh4G19+E\ng8L/QJOS3eV3Ak5L3ZLjFcOPbKEEL/TQZTOQ4faEVDzpKqJGKIVYoT7Tz8bW\nIvMRWBKMzarLCayWU++LUUW4tVkbiGZTChe/dCgLAu86kLLL7IhlkEOJ7gkp\nkKPKIHvCzYZjWUtp8qIoq+dTYpTpJqh1NYDNgcs1gbXK8HDBj7/Wo4az67Rs\n+kuXqykyGmer+vQ0raH2R9MWdZ9V+TayjI77XQGyUq9bgf5Cw6ixSgHAzM2t\n/+7dM/3R+uR7Rq69Vu2OMtk866Z40P68KL+kLhB/UTGyqVeMWj0vZ3nX1gJq\nI1So\r\n=Remh\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEMHf5vPhDghXROY5arVjtYusjsg0zZxKok8vd1fB3UXAiBRYI3kPnyjvsX6LYUDeO8NMFQCG760Nl4Xwuwb9owbbA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.16_1572613111877_0.5693484387793724"},"_hasShrinkwrap":false},"0.10.2-alpha.17":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.17+0cc6cd4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0cc6cd4cc82ff6f032e15c03435323239e3a583b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.17","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-62k6exkcoFdM5E+3ZFShrEDhUcVigRSGsuw012WUS8BPsohgzohZJClAFVpF//kPEIl6xiI5edmOO8BFl24k5g==","shasum":"6ceb7f7be1dcc01a687f77ba4cdd35bba58ea376","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.17.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCx4CRA9TVsSAnZWagAAe+MQAI7GA6k6n52mcLSwFTJ4\ngzeUsTJtWrA7zPDkpR9DLJ/J1gEPR2hHPie6NqYMJEeuYYvQJgqco+VHxHMS\num6kKWGRE+yqf7vqS7/RSjCGBu2kq8PJr0wtN6gyb5506PB4ILvN0PGAXXp3\nQrqsT9er2zd9RX8lgtWXhSg+5dFzUDP8hF4RsjBqZD3pg8k1GOUYy8QLjvQJ\nosVRwn0qkKpZo905N+YqhcCLiRvrkLLevslZndMaLKjs1AFKrjzL7+dh3RBT\nZUZuOoNALyFXrB72NN15phZivZEhHVHqXuiblwUN5jlmJdufqR2aMPxEJ/AJ\nmrsOlwCSId+rtCtbJXA7j1gdaiXhG+bB/GDr0eJiuz7yirhZ2jinCHYs/7zT\n+W/nKok1bG3Q8AQ283i9gY0xxTpNlLzZvf4KPxh4ojyQeUZ3C3P+4B2g31Nb\nkckqVeYYOHYDpYrdLaEpVFaAFokvKjVDo27X4Qs2IY38B8Zm9ji2nsEylkYu\nubF6SxX2qHCH/8BpwkFlgke0d1dINHBybTJ1a62EZPvZ7qxkDL2AP6sgB8uv\nhaDdvLJ0vqe5VY6p7s4wGaZlFKU8AU/0HVv1+WXxKWxf017NbgSyvfWMBK0E\nNaoHZghMmpV4cRaJq7IIxWG8eT8qy3Ap3ICCJc1QdtIyfl+9Ico8ymORs4zC\nE4Nq\r\n=rOqO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDS2jhhFE4QZoerR4Q40ebGWvNQVA6/RKlPxTGkKqeqZAIgbI2q4D0HZrz4HKoYcIAmqevqxCHUic0Q148JVACznaE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.17_1572613239553_0.9613955463543515"},"_hasShrinkwrap":false},"0.10.2-alpha.18":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.18+28488e4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"28488e4706b58ecbccee91ba6912c8aa4699a736","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.18","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cEBTApWhgtNKi6cHNzX63M2l08+JyXWMNxx3rbVbNvv/IWnPxRXZK/ykFs9zR4a1O9/oraZV+7iEDtv/gJsXmg==","shasum":"fcceff258fbb5e58e8fc3e954a41a0c46b775052","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.18.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvCzrCRA9TVsSAnZWagAAwE8P/js7mEvlddQgLHDXwSSp\nmu+2eEm8hseRuQtbAgKS659vUoXgEOriLIPaeo7VitVTTW0BzHcmAlqnsCL1\nI0bMvzUNgCMb9kmUDtaOZBOwszs6SIoBJu3zYRVadQy5iv/x4Hn2qbhIHGR/\nJ/3JTvo6+Ojt+1vqtZzLTodWgq5uv7Xu48BTT8fjY4o4fcyIf+K/c44nBQQq\nsZQ8d5e8nt5Mp1HCHnKiesZny5A+1pQJWeGDl0LUBLczCUP5A31VplWnaCQc\n319l1XACEfcS7VtQAm95V2wc7s1WPdyFyZ2Kc1y3vEiKx6tOj0G+vz6wb2m8\nYUlN0yiCRqz2LEymcjobTF2AGl4aE/kAwLoKh1wP4tCuKVi0427GWaz07car\nrcQ/h72YKmaFpkNbpvKvrDyCp0TYu88VvXOA9evZ01joqYZ0gTMDUaea5ogE\nlvWvXrAQj3O3+B1VAWbQeXmfyq23P8MnIbNpDcjf0c6KQfMC7R/7hB8k8crU\nesR7AhrgGSO1sQcarSlZ2cirOzplPC9Nr/eZCTfBquDC+VIijKP9UM96IJ/8\naQxCjMMOrb7NGKYM6BkFv+WGBokzrjHH70mEwnhEJnN4LxnvG+pdpXy0rTa4\nvj92vbK8FhFT852sVICYiX4PBojkbJ+ADfljSohPlJVPq1gvVUrPS2vtCQhN\ntTIl\r\n=mGM8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDs/IyNSyLu8oZSYpzCV6swz4+gSBX6r3qRedLDEjVslwIhAJF8i9LP9nrq4Z8DTfKq0sK/irNsSEuQ9NBIKzrCrBbI"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.18_1572613354493_0.24478376281194336"},"_hasShrinkwrap":false},"0.10.2-alpha.19":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.19+dcc02f1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"dcc02f1918ec96366143cf941b646fa43f193a52","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.19","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-iG2l+YbQe/mfez2u5JWY1WqPpMXyDPYU0mqLcaFny40cv6/8OBu5OGaYW7/dMeBYKMLYrD7xrvWDyrjYfELMtw==","shasum":"f14bd2cf2bd488332985e66c8163ae2b1f327019","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.19.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvC5WCRA9TVsSAnZWagAALEsP+wRwsb3XB6SGBpks2evm\ns14RX3KjNJAbI+D3pSAxC6eZUcdiTltvhz71+meRGbMsHDWJQ5q0WzZWR3F0\nEnWlwna263T2bG66tAk1WOB/v+Gynsnkp1fBb6GS8Sji+s0aHlOkyggIQbdP\nrJEE59OfR1kM2P+A4/T4e4PlrykrAmqN79Q957WM4p6zkMkKr4n3fwLH98ye\nLeCoobWCZiYFIvoVyDe/JKDYaAoH4IM4x7uNmqchcXlE+6/X0VtZbkI01rMT\nqq0XNUYw75E2rSeNTJjs0ivvn64a9QH4vbWcRkDQnWLHbsHzU81f64J40nlg\nxGBSwvhUi4Ns3infbl3GcpMrQb9mZvPGVbcOMIsHBF2zw4E0paxvObe/aOPs\n9O5TjYkoUaxN1nvC6lLBEnbXGmDFIORxh6WWu/0JKX/1MwEVRqBPM9BlxCbp\nU5PhGpFNbns7uJbcuYePJCxL9k1zEMlD+q+Rj9GaC+HYB6+eTtJu2ab3v6Hu\ndz7EVvYpgGN/vSixGhtZB24e/dKiN+cxxoSxq2ElKesO2GGB3/jm+csJRloA\nbd8ws4sAGodhFzqmMTib/ifKRuZqxE1VW1XQrY0Z1F5jOgcjbMTKVdNUMlji\nSzjHIjL2+ZpdyuloLDWHF34JxygcGf4W93A09FyPvlDj9HAUhHKQJ812WxnD\nEA7N\r\n=rl5B\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCg3CBfT3Q6UxOBObxSuX4ncYIzLYdEDhNzpASzPCCsIQIgW/AgNDpF4kidQ7LCJ72lMoqppEEt3b9bPjxHqVrvor4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.19_1572613718399_0.5494597338836056"},"_hasShrinkwrap":false},"0.10.2-alpha.20":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.20+61d405d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"61d405df7c96e2534d486f8e6a8a38e22865cb47","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.20","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-52LnvZ2BLjmz9fOhKx8gtcrRL7Klkz5J58MhrztHkZwLZPhh6UI5W0TIu5dwokMsh+0z+kmFgQYWKRUj5sS0Ng==","shasum":"89323732abe1ff0f8dcca8e913dd8ba6bcd67355","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.20.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvC6VCRA9TVsSAnZWagAAXP0QAJauaXLDHjYsmTn1j5+4\nW9Wfmxc5jnMFBnF79DkBKZWhqPi3bgFGFG4bQkO5Eil3NhV805nmcwAd5ZwQ\n0XrLeB6rRtSng9tTS3Vd90yBfCnB94Xd494zmfaTHlm5CIius1fz9QwUmTJe\n1a5u24vl4NuNHLgAUMDb+RItKwcfVtk5cranCW0DRVb6r5BLng57AyFZOem4\n16TJp676LFRUIjSS5TEuSoklhE5jN0T5NGeOl2NFXgCUabG6DTAKIZjBe8T/\nAo/aDMJz7VQe6QdJW5zPr1kCbw5RMwBJ8jm6pnmlLwSBlEGRXQQQBZgEvWFE\n6VAwZpS/3VYsJN3Lcb5yGsol7GV0eFUjwbVbrqIFSseRsB9wiyAEkxSzKCRv\n1DxMWG8NULCMARak/NmnCDLvUWeTEZOXk1lTlsZC9E8J/F7VtRiEJbLvl/ef\no0kddSZ5ibvQQGVpza2Jco9ILjDqET9SXUpttzUIqfui6teFAmSdzw76fb/8\nrQub1P28bgaCc/6w71K2jC4rnmCTnRl5ea16Z8rjHmHMmuFtppGF2SANc0Aq\nxdJ3ZnS2YKH1BV74ogF6ofE4NVruXkIQH0BgYpZccImkn3mI/TH+RY5JW3Ry\n4/pSqRUVOfTpzjW8EpVa0OaIPMXMsarSFhxleUG7QiADO+5I3TifbC2qwi5t\nGWN6\r\n=MlRW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGO7GS84c4jvlVA4EVOEx3ISJx6TUTuRzip1byl003CNAiEA0Ti3AXiri58lOXpLbP5bgnRs/sO+mRCskNlOTXRwodI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.20_1572613780661_0.6204685654820572"},"_hasShrinkwrap":false},"0.10.2-alpha.21":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.21+21f5c3a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"21f5c3a6d7682c61283c05c8fde5f88500e6cdd8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.21","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1ckHS+xOnIMWeP0KISbAZ9EwSNZqLiNWfYrGubtonsFB+DjS3JF6Ewb+oU7Q+JHc80zYogSOA/Up3KLiY0OK2A==","shasum":"9b2a1d20fbefe6522202c971ad04c65298720fc5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.21.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvC9sCRA9TVsSAnZWagAA1PAP/3kEIjz0M++ezHkq61+a\nLaIasQlQfZEYDevNsDeeb3crARDfRk1scNnAD2wKhZje3hinNwCetDlD6pkp\nsJYf/FSvfjFVRR71AJ+eFd3jYSg18vSaev+1Xaq3/CVaW1h3oYPVqjnrQNkS\nl+ysAbi7FHXZHyb1ucV+mXNk8lh/dmMc3LnJC4FPrsy7EnhIslwM7lMIMI4n\nZXPhH27DdjMrLKxeaHMkaFG2FFS9YGlGyiThydx9G9AxtkzTeSBEjJTkyoh0\n+F0Su3XKEOm0m1lX/F8mOJzUfN1F/9HdniC2ubB+OsFtTzsN6geO0JwUDRwJ\n71YG7hoYgeVl8LmOhlsEPkQ+Q1HSv8J74CrFpF0EaW0p+I3aHA9ihjt7LDv+\nJr8Mm9irtchqXAN7U4wsmplaXb1l0H8ymCvWkK02Q9ziPgMcXfT8QbFmdnN3\nv8aCGfoAXmwrRGtzeF07MAClfE7R0hKXq8Y+noto7Xee1tLDrkD3mVh9XHba\nbuKMTpMHEz9t+RaQZmYQeopCs9Yc8tuQivbdTfbLroYWNqVpRC0M+aGvseMr\nFJNJK0sk7fk2JXz0cw3IHs587NIND1s9Sv8WbZgpDneKeZigOBsDeNDgy1EE\neZkiZ4soKavvJiKMmuLIVtrOd5FxvOozvA/lg2G5WfgDvh7iRq0mkVs7wywp\ntFwM\r\n=QcNr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCfHfqg8AkYV309B4qhs4iG0/bdpz8Wkd4HxWS37HuluwIhAPPhgRC6EdQX7DU3r19DgCny3E7Ad+l6nkBfNOx+x0t2"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.21_1572613995733_0.010836239898593059"},"_hasShrinkwrap":false},"0.10.2-alpha.22":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.22+3d8b28e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3d8b28e0ed8c751f3b22b3c5fcd63a730e438482","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.22","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-B5OsAoTGnJgAN2+CXmVS9KA5Y7ka9fd1bSWIw7yKEbIT5izhhoc0MR4yRKVfP/nn74+/CMjCBicru+2Yjk70RA==","shasum":"e76dc08909b3d4ca57090b226c0bcc8e7e49b948","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.22.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDD+CRA9TVsSAnZWagAAPDEP/RUYE2U24dzt6ZYbpGLg\nwpvTjrKMfN8VNFaKGAOGuGvFjXqw0HxAQAnRyAaPXJgjuQyrjjgodbxJ91Kn\nGG7efvtV6ohurgEjXYIOyNEX9t1BJ8OZETgWYDP/BORfW7o4bOSwnS4Mcw+0\nPb6oWfBXtZAOJUOnrFQ9NmfbIDwIwjhBxLbfamfvspNLzgByYZZHTRyukLrg\nopdw/91ctW3Mto1xvALMq+oeF8lmnBjMMxM9CgQ/ptV7XlL+BxXcGD97PcKG\nYUJggUUKUZYFmhChyuHHF71gIJmgIs2Fo5bUoxSgqfk47WeehyGYSV7c0wmG\nQnYedTzWFt2uUEVWg2S9MSuNiN/WQ5K7b+X6HXBFxqcrIcCgZ7qxT8AjB6Ux\nOC3mjRMfV81fuIPHObSX+oqfDQxG3iAh07jAOvxqUwD9LpPOli+QtGZPmcr3\nYXCkk5eYFrD+16UiTm4TaYTMZsEMpityDwTtwLkGxz9xwfmg2XZ8fJLgflBx\nMU0rs9FOef0n1P4sJv8iJBlc03NiXrX0B8LlyhV+o94kvaYw79HTrU8CiyMf\n+HHIranC7m9BZSR6SWjnk8kL3AYmd8FfUyr1vKpS7py6anCZAgYKm5VUEw+2\ns8jQbFSEY8q+JSUp7SpdQCx1rg4dyPH+DrGFpNqYxl4D4ue5XiTeHbSXoSNH\nm+vE\r\n=FD/A\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDye122Sn1e115sqXB1WU/m4iMAA3QJFMIRLllA1vawXAIhAPaWRPsg1puHYD11IrECsHkKxygjsXAJBN/ijBgarXSw"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.22_1572614397683_0.5284927461179629"},"_hasShrinkwrap":false},"0.10.2-alpha.23":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.23","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.23+24586e1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"24586e161763f9a4c8f52a4578f7f93472f7bf6a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.23","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-V9ytlkam5HZYQsIh309F/rVrqn0855HY8kHX4jG1TvgchpjXLjNmWmdedo0cyGJODuAYV9987Spwee+S++vooQ==","shasum":"225808958be3e337f7d9180cbf6a8cc1264db149","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.23.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDFECRA9TVsSAnZWagAACQwP/3uw0L9ZBa+YLpuoQJNn\nJAIYNEioDyU+jYc5NsBzc6LB04tKzlikdFZJ/xymUkwpSNp+smg5MyeFOGL0\nSFqXSZfj9B2XevdVvFFFEF2C7EfY4LfEhFIwAoDkTN+K8WznVk5Kvn3zpW5h\nzroRqMImFunzW8k1EeAiMnwwcyghfubpY+9esied+vdpEY6sLGTwvoEaGAAq\nSZmjHcWh4c6h+1pHtpS4jgikCB+La0FZZdzxrqt/K29WaIluTWs8qbdTuayJ\nypIOb3Z0C/havPF80vyCoim82vkDRhQN8cW44F/iJc0rMRu608MqGaPDU8xV\nXFDq4mNiL81YePHuNiT0XAXi5HfLmdFbTtOn/p6xRgiT8z9ddr96nd0VwUWx\nNLr+JQlWBo+oaut/0JXsRbGoQTstmYBLfWltrJAR9SsHrEhMv/7hUEc0bsMa\n7w7czJoUronuNH5bJpBE2Zef099tbdGyvT4GTfjqvkjRmPhmlzLma14+26Sr\nK9E7W9Y5Qvqufth4TG8BrIbQ1aVBj0JWNATET6gXy7WK8kOJ4lZsA0VRkISh\nfZ34RbphRHsLrf4elU/ZdMHEQSc+1LinXLjKnFg8NElCg80ndEzMD747+Y4T\nb6I42BeteYorQEQ5HxDq3aT8mKRZFvxIGiF0nE3+F35O5GHx9zTQLTnJVXLG\neMZm\r\n=LfMz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDe4iI2+AgQ/b1GETzYKfsL6XQxl1DXTa2ZlPw5PUNuPQIgCbAiAZxIWH6j6XyjWmjSINpjrfFBi84Erv8cqJQaFWs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.23_1572614468200_0.344161421729859"},"_hasShrinkwrap":false},"0.10.2-alpha.24":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.24","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.24+d99efbd"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d99efbdf2f1b61745679a1d587677b0360ce543d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.24","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-HMIS65Ppg3jN4P7Api1eGPBluRokwicmmdArIUqMWDvjWMmx5rd4Q9gQQxvImC7AvtWWyPNUpo1elSeaTo1HIg==","shasum":"adf14abf4dfa449537956d610cd1ff233d8810b9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.24.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDL+CRA9TVsSAnZWagAAbd0P+gPZaDE1WKLqGo8ZKo/+\npYROtRL8rQi8gOvlz8nLC40vgec1AOyuftB4HTxnikJjAdyrNW03n9quvO2V\nK5Gldkf4/9zoCjf0vrCQ0WQcIkA2oHaffgtb7lD1NQykPq6dzRBCOWcm6XuO\nEogJvQBFNywGnII8NQk9V2yW6uChm2pBUAMCO21FaMcSNzcVaxqQlMk/oNX/\n/tDYYEEMg6/5Ro9YucmQ3sQgvUiHGDry3AMs4xv/LDwhBADqkv7mcLKe6JVm\nCZ5gTN/H6DoDaq/OxDLZi8b1Lh6FVEHxpqCvr2WrLeoUC7v+q0jo6NuB5oQq\nEL/UaSWTLR9BwyR2SethgjPoI09v3Ct5XzrqzwEBl9fyy6lhNqOYkJys2n8n\nzzkvB4imMMTMbV89IyyivRvad5eFd9fEWabBxpw7kFdadnT8pix3zPpLh7g0\nixl80PX9Ot9n4mOfUHuxd+kkQQhEa1lriqsa//p9V6LpjiWBQC8O4nR+IbSx\n1pHy/ciF6GYW91Yupjdy9aP/dNPGl+TfVFWd5qnLPKpViV2BoduOcMeBqGlf\nuq0R1XedhEIjwquJ8AHQEZZps3GLJpRJEkCzu3rlhaXBPrwJpKv27Crer/cV\nwVHyT81Bv6yFyodhWR/XuVIT/YYWc0uCOfO5oPonNUrMfPfDGIyPwyAgCOPM\nIlSv\r\n=6SJZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDacS0g+DEE4VCe+rU3kyqv62ZowiZu1ho6OyflJAJrIAIgUVXWgWUUqXhhOobqcHp6gtOLA8YkG5I6/2bbGJi0v20="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.24_1572614910227_0.6863850185476452"},"_hasShrinkwrap":false},"0.10.2-alpha.25":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.25","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.25+e148809"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e1488098fd1e28937ab0d7ba0bd2167f7fe89d29","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.25","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-e7hJ/+4CU2emQJNj+t0M/+E7T3yjeyjeedrNDsKkmrIyzFzveGRfKR1HlXs4s9WvxSQ3UwSUK4cx435Fo3PgXA==","shasum":"dc00f93d6da729f51299ab6347d0c4e80d90b360","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.25.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDUqCRA9TVsSAnZWagAACnwP+gP8RBVBcq79SRFytezH\nZeJcamTZ0EG1GydI1cRHFhg5MFavtliTGGGD+mqVomzWeC09Ym/wuC6T856Z\nradPoq1U+rBir64SYR1sV8YXIUK//wJklymEtVn9dUg4jM0v1gWEjeI1zWNg\nKRkcyoWxiUgicovLz5Kv4XNJOV9iUf+ByqxeMZx4+OpxROvhHp1Lc82Z1ZY0\nVPNJE7tWVI02PKtGu9t2ogfmpQYwYamXxnvan3gkxrNZVlhmExawEB3/Y3cV\nnt9ph2qhqJY8yYCmUMsa3UMbhIuki7vMny+CJ9tsjqRfhwXct280htymUMvU\n7aOCSdpboPBnUftSG4xn4waBjenujQMRKVjlapV3lVEFpTd5VlE7wlaNUjE8\nXqkD9HhNYfMERIxAOgUcU9VarI7hgbe8lDl4NZOXgCe/7TWY0JBxnUQUIlUy\nco5Jil5xg6hkVuGhWABO51TuosO+yW9xLWWZE6xKCnx9id4nuONFwwnjZqmz\ny0YV2D7j04vfhYluKsHnpaKFR5wqPV0+ir5vB87VkeVR2bcJUE360dWFYV+E\nwMBsxxN1ThkhvK+osAOSEaDpGMN8kLsUskD4HfwOSRWhyZ+3/6kxEbh6N0Vj\ncg6PcgEy2lWbFGsrv9LoC5mn/4Hm/BZ7roxkBtqb7fNnRjCukuAF/BVZRTLl\nd+Xj\r\n=Jg0g\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDxsVgOnZuEd1Bqwl+QmGJkUry1pf3+blhVQAiO6yzrGAiEA+wv/nhrPX6Vb82yyimS1MJaSTqap4yijlwZDnnQ5NNM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.25_1572615466039_0.917433256442238"},"_hasShrinkwrap":false},"0.10.2-alpha.26":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.26","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.26+a8bafd4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a8bafd4fd39f0306001545e080d83a4a0f1741a5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.26","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/6yr4nXoUjW9eGVdqR1yBsQ5qICJGidIiTTQHtMsQo8YXOFxSMICsYO4zlR/n9UmRc397WgIGA/8e1zmpR3N6g==","shasum":"f240c73c2331118af6353b54a6637523a1117a4d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.26.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDW/CRA9TVsSAnZWagAAwAgP+QDQueKMdpZdQUEBWhad\nrrUyXXsNFQx+B3iB8zKFFp0Ac2OA9y6Mu7Vw9IgGtp291BsNAjPbU99Wdn1i\nNu0r2HI0NU/nn2Q+Avh0N4KycHLtAbRx9olQP/iRv/F7VDreiekBmcHuxv5c\nDa8c+v6jvH3grlZ2CAFFjT6aqXco9onDyFDFqa2Rz7hK99YfGeaDOXaw44nd\nnu1ToH8InbJMT3PJQ1oscTMGvHfljm8c+pKAGFQ+5lS15GVdf+u1q7E17tID\nOBMYTgTeFgV45kAfzCIpDPfPHQ4UkqAEcolhpdLOl0hndq6CLf48eD1IPHV8\nxf7EiUSPTvK7nR/D/jekkD2w7jIfspPgrmie3CiP40VqfdwJwlBQYRn8eJ82\nVtWc/6etOturvmr3B0ADj/guKQyr3WOBKVntF9Rfb/u2rt8LV2UoW3Ypavax\nV5bUvRREwiJw+oGUXmOBdrQJeDdTFR2CbJM2zzP1vkSsjau++Dokt1aVo5Gf\nDX3xItDFsKf+W3+aNLEX5kWLaKvGL0bhUgVoZRhBcZyp5pcetJCeL2YxtmvM\n3NrDji09XSyYsAc2Y0j6nb1p9t1LgmNws5pY4G29L8MR1bOGHxrcOJ6N7sY6\nQ8lRLBIcz1NkSyWR+O9TVwT3hUT91NGwUdtRNIF6GbHfpW+6APQjPUeqe40W\nNua6\r\n=SOqI\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCWEqdY3pI76IeaWeGz8epf6UAsTNCeO3GqGdgy+NB7pwIgMu1ehzaN6arj0Vj2yXFoUFydqYgQwgr7Dmz6aXBYZ6k="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.26_1572615615472_0.4219288488490036"},"_hasShrinkwrap":false},"0.10.2-alpha.27":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.27","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.27+d10a13c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d10a13c7c946fe29dd0e0df182905fc667f998b6","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.27","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-V+FgRxnCLm4cAllUBHGuijWciEYzyffb+t8KxmBCCx1VJXv4IDjKO6Q+K9GfrQmcYJLDnGfNNZnkuvQcxICowg==","shasum":"d0e3151a30c9e5fc740a71b9a70ee30fabdd0cfe","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.27.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDftCRA9TVsSAnZWagAAkG0P/jZ1y4bWgH5PuQUA1x22\nGx77RGZN/fYM5cSsHUh4PW0NsisDRjr5d5jIPqLMhALTbZTCPclSXDlf7Qbz\nidYsjI5pW8p587qh5q00MwbWJKbojEOvbljDJcJMvPduxmGWQmqAlJr3DXak\nXiVZ66LYFdpq76ywbay9Yk2/FsgPhi196J3oCHbrZEApKZdgY4+VdVwbFDtG\nMiQQmr6XumsO4TIQomxSDWWu527eP3yXVQ9UA9mvpFNASgJBF58RV1INHT41\n6eQCyFyFb9FAOwzBBdvgBYCyWLl1km1xphWq3PFH6fng+Fa4zQx7ia0xJGMT\nLLtOijQaYq97oarLJv7DcXCcyfNZ7nU1j2xsEXQGHprs89hkIZGs2nQWhjjZ\nE9/326CQbGWRjN/7uXWJA1CTOrO2pL/CQ/An9loUky0Yrl1IFlYu3qtKPucW\ngSZlBVpykopCITOMOon3ZlPOn8m5gqXHpGIpZCOOuWSUQjyzre6kwjt1qzIX\nWPGCi5XoRX2UXGHk15YsYiOQq0f7JgmEqT0jhzWbN5/PdwOVmxMVAwP5MRGS\n0gTp8pUkQkUcaZJiu4eVsLXTuD55IaEkj0gXlbP0hb7cuOtSYQ5GBjFB9rAG\naJ77IhMp3XYeCZZ1EKn+X/hIW7i6XejQIrZwzAIkgEh66fGisNKdFvXcHX5g\n2wV1\r\n=raI1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC6Ak+kYsQVGXmnj+kH6tHSsG3HZaoekZ/J0nDEMdZ/UQIgRGoyiAQI54aOvbwY/dyc2zBCzvyzWLSpfRGUMeWS26E="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.27_1572616173057_0.8122180812043429"},"_hasShrinkwrap":false},"0.10.2-alpha.28":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.28","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.28+f320340"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f3203406179c8cd88510b9bee49f8bc7f8c515e3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.28","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-d5W13LADLBGpmIGYVcPV1zzEpKCB0Iop4VYDLYR/PAVCtjJdF9rN4cVlmWIu+zwND7erVBPpzC8R1p9/gc2JSA==","shasum":"716bdea1aaeed8060c67074913bc13652a8ed5ec","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.28.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDiJCRA9TVsSAnZWagAA7esP/3vfzWROjwSmKKTQmawD\nAxHutIcLu4SGrfyZCWz04etJBKIl7P04EcJvFS9AQExAHMY3T3pxFY3/n+rH\nLVsfz0ybO8nivVD98i7NWh61wwmOV1WQbnpH8pF9XNmTvX5GkqVbLxIoDfsf\nalEc8qdWMlzZRXGYjGhrEj+f98FIzXzWYNtHUe6ZNAxA0KjAPXElR1hC8+8F\nZkgXp6bajljDTlnZHE1Bt4lL2mdaAiV0e/NsdQWDnvKs0Gs6IkoccAV94C+B\nDTOzr7TjUY1tcBSgNlAeStLAeiGJzzvoULut0MDxUE9oiAZKV4PwnXBopEeO\n9udrEO4FQwF+vAcgmhS9VhO5PPYtQMus5xhtA8xRUCOkXccmOcOuagBzOh1+\nTIpgilZdsByq06V3qF/yaSC0f3ZXLwGSMy7ToL1kKW8Q1r3W1CbegDXK+jtl\nHDfuzyZe+sMYgFwOeboHMSUVs11DJN/MrOscrFJOImzNnEEPeH2zva6T/IJP\nN+3p89ZhGDxFgxx0YaoKnpz01Y9XZ6u/dNXpHpXPmO78fvXg2NKpFmf7849W\nNioKbyzL/IELBkKiUTe25ye9bgbEwqImzUBP28qWtAcyfjQ+K7VeEce9cH6e\njZudyBAjTABTK2S5Wg7h0Gmp2XmEowK2RbQhLaaMJa30rfZunNF1uj1nPDEI\nsM4y\r\n=EO4r\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCwly6SiakqEVsU2hvufqvcKc+l0kiLlpfXmLT9m+d5OgIgIyBlfzS6DbHK/SHedn5lWfC8/cBiakI8D8TTq+CcS/w="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.28_1572616329013_0.6865653525924165"},"_hasShrinkwrap":false},"0.10.2-alpha.29":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.29","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.29+da1fc4d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"da1fc4d7226d5a2a7ad8ecbbdd0d6447b7fe75e8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.29","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bo4rndSQLPRFowdqUgpqfdJcwDEweaKjO6jHU/ebkJdEtoztApE5rlRwxodc5e97skjqe+afY54U/YYYCPe7kg==","shasum":"77b4b052957687f2a613091fb8fd795506c2342a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.29.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDjmCRA9TVsSAnZWagAAU/oP/1qnddIfaKwsw3FaEjWr\n4ucrnf1hw9bZIUknnmQxjepsZFUzWbhLsqW0vjrUAHkz1WS535lzE19wX7K2\nFP0xO1tV1saQgwWRLev1cPoyZpdikuq/wTlzVwJDIsy/A2s1EqPWDufoYlnw\nnAMKdsuiXXupoqt0BSiOM99KsCKxJR0NtmuuRWsCv4MOfeUB2nC3LHfnu+17\nOrgeC7D7zVR2JPz70nJ9GJUe9EmQqyVs37rhPyv2a/wHsm7pyjXG/+qWMeFR\nWxPtCUIk56WUT8xGNFCoBmsp4sl/yTonYSSZTzsaNiz2dytQZxzFTHrg1cUq\nsDMwo8upT1HF6iLonSc38evemJsx8gauud7BHmav3FDl8gaYSf0Td2D6Moz3\nYY8Zj1tkLdhXZ3K27keGKN/3qFi5ixIhBx1M7EXq6MWsufPoATppngVG9ncJ\n4SEVsWvCbfVGYWyC4gtqpGqMJNyzwg5M+nKJe6iyA3/ylNoFZTK+O87OTFDa\nYqT39m9LFMPOfvr+X9GHEXAHwnVtge8piwxRJ7DKU0VPTrNjJimRtcNNh7xL\nrU59Kzr+MrIsQH8ZPGGQivuydIhBkchr45/vur/7BjD/K29wnv1aiY5a3Dp+\nLaSGm/oiASMhQFekN67gs3OMtyrilaEVHgvg04P3+RlgXDlJL7ouA3U7KnP4\nW+p0\r\n=Cy69\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDJjTVfnUvJBZOKKH/pY7aplmzcCU0CRPWS3enzOZ5a3wIgMcoPPCmmXCKc1DUr+cZUGdPPVfC7l8kca9vUKwlAdJM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.29_1572616422316_0.6170122265949565"},"_hasShrinkwrap":false},"0.10.2-alpha.30":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.30","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.30+7b538bb"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7b538bb6b8123542b4f0e475ea10dbaef74ae0b6","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.30","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-osUypgwpDHdhJPTN/QCwFV5k9TW86qJBsddGafjjJw4/dmSHU12Jsp7yiRQzx2KwP9q/eByIH0P9w72qSM3uOA==","shasum":"2e3469b1449d3db899c19fc2cf56e0ef48b45dca","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.30.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDmvCRA9TVsSAnZWagAAPCMP/0Eoo4N81mLRHZ0LeJs8\n9dlIcqewtk9HwUE+FvqzLcSnoaVJZ9J5GI2xOKVXr0wZBYzBg7MXMQiw5h8R\nd2e9lFoxecKTdw4Ko0vkCkoT8CmyMEN6nS2z9dm/oqpk1rOQxN3Lb51RL2te\nlIEBCklrI9EMAEYvixQRVJYyjya7rA+Q/A8ypo8v58tK01viW9u86xHIw2F7\n/G3qhoFM/E2k/ZYh5o7U3e3zn2AOMW94FN0xBIRJMYcrTKtgKHnNkpLQMV/S\nKF6BD5A4+l2GD746vVQYH8MbYXhwaBkfFaKiKD7kF4OfmUwOXgeGcNdZRxWP\nZejzPuFyav1Rad8QKXwNUuaq8LMzX8+FAonPsGAuYMcUd+6x/QgM1EWIgzr7\nhoSTXEK1k+t6FcRlpvFZ9X93HObBSuRr7w5aB6so4fKbspYBToziSTVxns8h\nrCEqzzl2SnWD3eH8oSwq8QpGCKsCRMHyGHx7vG1+8q15giQ+mpdP1NeEmxPO\n0RoE5PXqUWfKOjJ/AVxC6MyxIzEvFNnH5oAcGJ0vZ1PfJK7RI5YHXXzylyLf\nZkFgJaRpydjapiprlPNThqFudDAWc85kZ3Oh02cB9WqJfIkufc1mSdmJD7Rb\n67s11lIVV9xZ4DB10s/KT6z4/3laOFypCxFPmjVflu9L03s2oy1Dnyc7cDSs\nATyh\r\n=iqM9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCMTOd2DDt0somLtgYoGCIQjEpAqzQozXV0NbjP4ZMYNQIhANdE9HdWX7fNTqszhA/a95qjbqJjjnfE3KumADSnJvYm"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.30_1572616623153_0.6157310550562771"},"_hasShrinkwrap":false},"0.10.2-alpha.31":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.31","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.31+b5c06cd"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b5c06cdf51fe7086935cf58816852e61347c3678","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.31","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-r8/IlgOj5fLztipWzAlmTPFWJxZO5xgdwcqRrfVRHsrrqryfKQ/Pa40D37c6KNrSKQjzTG3hu32sFYfFo48BXw==","shasum":"8000efbd3bef70b01b23c87f6dc85fa7d492d51a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.31.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDo5CRA9TVsSAnZWagAAhe0QAI3low5Z6nLHraPg3adj\nFTkeD4XapVhM9A+b+yl70uC94HwX4amjqAL8mn47+p0/KhiryKEWTZy4AEPF\nt9fN9odebbFgZB93uGFCBZ08zTEw6trgeVUKnonPgaJpIczl724nuQm3ZYe+\nXKeXZCBKq0EgjFAxwZ/DhthEy/DtBDNs2tpUz6QNkhb7U3Aeiduqp0n1znJc\nYg+3fVDH6JXT79np/YN9qdGoqzd+9Yl46xnLkX1ofJJWouHF969vHjB/oJu9\n5eB9Ht/s40cRd8Qrg0V4KkGhuaRMPhVk3V87fmJglfiJzrrv/y73pxurMwRW\nqAHM+D1O5t38Kc+Llg7HwX7rLE7F7fyUJZCqe6g9+UhGkgt/Of9znYlbhbpp\ng7MzQGB7tILL2jNyayr8Mm8DPwibjzLch0TCffpKW0HmZQQ+qdD2pLYE6wS2\nbNvUKAcKrsbpJBurx20oI1QirTpGkFhyhzNvTuBht2mhYNAucmEOWRqSR5GJ\nqYY4OTID9Qxc264tBOUzQLRSx4CzY7xPTaRQ/omZqJFuQERN2Al8VrinLTAs\noO01MP2kPH0TvhIsjMk8TYDZSrb5HD0WRUiI1g+ry05EW/T/9MSJSlk3nszt\nWclKE1tuS5gihBzFLric3/VDF3X7Y27wXquUaFmM3Vwsu3BSTPtVt7NvLGiL\n+ESn\r\n=iEAc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDCDvKR42f7nJR5iecyHy9MQtaunMb8AC2mQ9gKDDMpZgIgLNMysBsBzyLMfbRRN2WlWMrP4GD3wb6FLb3CAmqShR0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.31_1572616760823_0.6699558859665313"},"_hasShrinkwrap":false},"0.10.2-alpha.32":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.32","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.32+bc77acf"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"bc77acfdd72623e1ea1cd7408956906789afbb20","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.32","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-PWooeSiGYxL8laBXyr85Hd+GUN6izUjrNvhMTaN9pdf2/93zrv7xXZK4wNE97LkzQT8MVSsevJWDdfXLy7BUDw==","shasum":"3a29a50fa582c83a8a3781411912b1031ea5f427","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.32.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDqzCRA9TVsSAnZWagAAk/cP/AiuFpyR8J117mZXlKd3\nRxcnNjlhoad72twtxdA7Ski2HAeijIrK3NHMaewU1CnVWX2zMxET1xW5A9kQ\n9Ira0idrLxXzxumhkoUn2iqv7d+agF48Q7rurzHUUyVUoD0WqJQDZ3KYTa27\nspTuDguffNDlTyTwF+XBXkFfgZ87Ys3QBmjR6xAvCWwYnhyGs1bBZgL7616W\nXjiPdgPzMrlyZ3aPkRJUP+3LnvztQGa6vm7w3LniTU9ryA5RJtSY1ABdOUpa\nK/Cu8pGORanqZsNThfvYsmF1ysDGeRUjv6XPNsIvpS0wLAxBuzMxwOumYPfv\n4/A4ZQN6BMyxZsBy/lkBZVQbXz75Z0ZfACCbQeCnTybc2NubAHZBzQmBvqaU\n817/eCUIa8jCCbsHJyrI1UsCtxPvRZbjMP5NrNAO1uP8KA68hkz2qo6NK1gS\nBEIAa+qgrnbHNV0M1DJ3EBIsmGJybH8d2Xxf4R9EDRQUKqpWpfFoxEqoXeNl\nyu+t+3S4jVBl/MPEalJEcX5pSR/GOjkkIhKBhjzqbH4iMh67FqwSl8ZBpxtF\n6y2yYRjsl0OBHZVXw90uUw3QNvqEUygKIPiXiLUGg9AXAiCmS0Aimvg3xJ8Y\nPtJLl94VxfPNxyOtcuLnCW30oEvzBewLZnsWt2TSOE7ZVTFdFcaCtnYeq1Pi\nUTto\r\n=ciR3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDkFrDQgwibCuVwvM05TblqcnozzNl6fT/vB7BUIgv/kwIhAJ5kHipci2fSdFbN34OuaujDPSO393X4qBnwJ1DN+BpI"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.32_1572616882639_0.2645419344072564"},"_hasShrinkwrap":false},"0.10.2-alpha.33":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.33","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.33+12bf2e0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"12bf2e05d826a676d9c31cc0eed08be5bbb40458","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.33","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-hoKl+qc8GDQ4YzNqxh0igbTjLXYh5G+x8dnrLaLj9yAdj6tJCDPEOGdRQ9Dyg9Z9eOWoLxFoaW+bMzn/Svp5gw==","shasum":"7eaf24072ba99890e33ffa9eac6c31ac09507ec8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.33.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvDtBCRA9TVsSAnZWagAArCsP/1wpAyYCHE4FvDFOZwBo\nx1Nf84rNR1hkVEJkX9iksKHUGdnRSAHgl1FqmLCt1HhTd4DwF2oShRO0VcAE\nZPo4C7wAcheq3pU7Y5bdNg9ECpw/UwsJB8vRMjRsaaoTMDDPN2k9lJuZ2Daq\n5j1tjlUWUxS8eGXLkoo84ZbeXd6DDsUTK82S9tvaR92VXnyfv7iSI7Z1B2F+\nweUMvzlb8WHW8VVd4kYXl9MFoCFzq2sTIDORHZy8Od/94mTE5yzxDFwnt/M/\nKfYQWT89BqBBcG0FriUANzoe6zT+CVOBAvHG9ZAEmLMBSoeYFR1DjiiJP0Rm\nFFwTTxtxzaVPbz5VvKsGPBd3ipqC34V7V+/dPzesWi9dMz8ARtSvBvarXhYG\nIWQsrTaI2AnHM6+IflaoHQN4//6w9Zau6IM4X0ToIbDiPgvLem6fRzzs/vqH\nmPRunpZ3DYZaokZK138UgMBFGmnzH5VfjwXsmn4weUlpqg3lbHuM8GoFxdS9\nsN8W1qIywpgszLPiDcfyOk3NiOD5I59ZEgn+dhLh+CHxcEYLRtJzKrqBOuYw\nMDx56UpGRrFgsTyifHiPTSFc0yi6UpxiOJBK1BT4v2L2IRaYnZM1YUaun8m1\nY8L09jxNTmCbRzhoaqGiagazn+QOYZZ8Bba3x3Niqmjas65lgBiRX0IJBVkN\njQL5\r\n=H/T3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD/IMoLYEV5ZXKb2iXZV5X+hb8t1OItQPf9C6U8zYitggIgJ9JpgKA+/4uvBx9KST4tb/8UsF5itTt1M3+Kt414sjY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.33_1572617024531_0.9020599327970134"},"_hasShrinkwrap":false},"0.10.2-alpha.34":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.34","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.34+2b40f5d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2b40f5d42820a877d0f68975231fe249be66e2bd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.34","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ydEJeM6riX+gT3NEicguGhqgRzW7H0tlOvAlSamN2uuJPlFxiNlNF5l3NQbtJ+0PFxtvtljpuK4fGuyh0CmVOw==","shasum":"7f591c525b960a5256e9e2bea916dfbcb9e26aae","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.34.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvD1nCRA9TVsSAnZWagAAGnMP/jXJRHZEb36zPKyglC+k\nyhlm5MadS3ol3h3EHWBvJMx3XXybzW315yU4oh7DeVej0u0qeSRxSKFRNtsi\nlm3gA7hjy2v/hCemsvOBsOygui1M0OhHpcyH28q5m8dBs6Sj33gQ033Fl7wW\nF/Q74fsa0oSXOU4yyIG534Cm/vBiiMskAq1XRTI+3zkr3VHqpOSEKgw1j+xm\n+aMiCtfeM7YW23oSBWHquGqPmRk8GbBIV7JDOYlESUdmO32moVHWXigx5WQP\nSEhSTEtw2uCfNBJaA+k2p9GfxpsiuC9dohvWdu2DMiqNlkkbgSf4h4X1NOJO\nTFfchEdh4fteATCB2mTDwci/NrzNI7Q9wwa2p17uPdBLK+BvEAbdXDJj1xyU\n65/XWIq1tPDwJQKRJsDldlV+TZ+RvzZvQrDwX4vAewVzJP+/UtEFyyRU2Za5\nhGw9zP5uZHNz2BIxKURtqjwEcUmfmnSuz+GM2wPTj23QmMqv6Gf7QhWRF8p1\n+LfjB7/jRVwoFb7A6pJzp3RMTKlua7na9VPF4Ujz2Qk8/7ESMJEXNLtRx6Pt\nOt6pdombt4/PB36EyOWYO+5oxFIGVfaTyivUBjRWyuLVSrUj/VjWh9V4V+gU\nrLYa+ZJmMRfHYI2WQuNkO5TxZtApm4OpE9cv27mH2yBHVUCT5Tz0qiUwx5hU\nPvFw\r\n=6qlb\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIC6XmryK97DfutbQwtmqmQHiPBkeqvINaCRa99h7kvluAiEAxjl6V//J1HsCLpPWiWB63NFGLWC+EHDo5rx68vefT5M="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.34_1572617574791_0.5575619444684772"},"_hasShrinkwrap":false},"0.10.2-alpha.35":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.35","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.35+ef5ffa2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ef5ffa2f2f20eacb6e5d456c9a6f9ec62dd3319a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.35","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-abe+YStmfDxdUlu9eO7ZzZiGNuXgBhbn9h5LN+loxx+nK+6PbvyxU1VV5Gv1FDFw1fwc3G0r3gQnJcDg+bSqdA==","shasum":"ff5a8e851e2942974e6f2b4e17dca8a87f9c9bad","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.35.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvD2+CRA9TVsSAnZWagAAUbQP/1BlavoIQ4xGd+tL7jro\n7hUkDu1sYKxkBOi1dFPF3sRoBReawnxo7Fi0QV8k9F9alRFfgXG7WUrVk555\nxDZdyt/DoiFZ7FCbtru5ILAVNN/RvjizxrQn2GP4s1+SHoeSIrs6sj/8Vm1o\nP6wBxWf+FawpKzFmsK/p98XCrTw+YjEYJ3gQGQgBox0QPfykTBtBAfZb85QU\nTVTbQBcA6631a+54awUgBo6/77J65lVOiGHfhHTXkIRCfgFterFYJgtnHiag\nJ/luptBzGRlN1nWdivdi/3GRCedZCZ6fE7y4ttgxEsLoy6d4ryEOZBXBOCkt\nY9T3pV5mPk9B+Jq8244F5+RsD1S1Ll1IJNrwTjBXqxMoCvjfxDJakn12FabR\nHS75nQFJlFq1X3b1v976CemJxG2uYH6GrSyocOuRgmb2kzUBxpDZ0TflQhbh\nRu4l0zN3ZI+CxRHF5vFwT840ia4DaTtKGtCNV0tOYxDtUWlaWgWi+IXKsENR\nVULvgv+Uv29/ArxfoxCfl5LgomCeIY7BWN6HTanagPAQykmZnJc/3ZMyyr26\n91APdha2xLtf3DF9H+qnhZr/EcpjM+QdA06P5BOmS7sNmmvMgSTd2UTmd3Ez\nY7qZUhRcuWHAnHE9WDWb5wEYJYQVQ+9hieokCg/rfMB02ukXe++1Zig8NkLO\n+vjD\r\n=nMea\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCypSr23QG1qRfvWDX1Hc12VP5W4NhhO16enLbBVmeHpQIhALIIYTNu4puSUsJnlWUkRYp1h/gUrlDyw6MjVDVkkFj5"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.35_1572617662593_0.3295158388996944"},"_hasShrinkwrap":false},"0.10.2-alpha.36":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.36","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.36+df6bbc0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"df6bbc0938bf9cd1da4190580a2a1eab436720a0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.36","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-i06zIxEL8R3u27+bOZsKWefhMZDvmnKFUnJuYf1jkX4tUMQn0rnHu/qbfd8Kb3/m0N0iixC4e/2+Z93Aygr+1g==","shasum":"a5e2e87d633ba6286f57d5a36a726aff509254d5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.36.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvD45CRA9TVsSAnZWagAABC0P/2rDpSy1i53ovf6GwgX/\nsC5/IMXm7OHGZ5msKUQ7y1+67EPAaOJNX8Wu5NRVfIsS0FmjiAjdW27AHk9y\nnpQq56haRpEbRVBopZb5fZ7Hlrmwmpq7yYa1LNeNtJ198j4so08iaqdh/uCc\ns3WfgvMJgv2Pgr7hayCKyOe6QqAxKj6cUlxKKrp6IQnzvai+FMnf6m8mR+1h\nXxWG/1TZ8hk9+4vNDiRGaJtiN9yoyPqOvlb0mtVUWj7gkrQAV8DiKjHzgC5d\nMynQ0ogeeeMnJrLdkWiEF73dcHXF1F7x4w88ARnMt9P4FzZ8R+6kuD3zfzQ9\n8wTvH0MRw1PHsQa1/uETA8wOwepkhFHGLAFu2bi63wXucTc1B3nsaTIRF0rr\njdPqocn0S7qeXYkfW70lrEI5aBdS751XeQSjAvq8rTLZIb6qiFYxVNSF5kfQ\nrsvNwfXwrcVYboxtg20LGggZTGS/VOllTfVy7jE9FeBukUMUiPWjne9ESW1H\nxywBezzPlpQzNgGU+iq1y3xE9j6chS0+fXuYwDler9f61LcKhcqolLbX8mEa\nr2Ot5tVy1iV/4izd+Xpu+4sqa5A4LNuaO/pXD0Su1DvgpQiAszNH3mi4acCy\nfsYoNeEIEaxnrsAl+JozIZ++a8lvDgaTmPQBEY3aSPTeE4/fhgFZBC7Iys/d\nJSRX\r\n=Mr58\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCmI8gH+fiogIv4uXjoWxqzqORaAta2bH5NVHwJ2z9ZswIgd0plX2QVT/5qyPtFTi78NNX1E7wDu0Biv9wViF2IFkw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.36_1572617784505_0.4583436507236829"},"_hasShrinkwrap":false},"0.10.2-alpha.37":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.37","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.37+b279888"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b27988821d14acae12522457b74c1d563988e368","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.37","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-EnC9SvwpBbTCozs30nRAhbgJ095unKQpUccyVWUgcLdCppdUv+/64uyw3n8NT5K6QlONNkXf906KgRnsxtPOlg==","shasum":"7602188d7531f15c238bb5c861ba554a7714c696","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.37.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvD7iCRA9TVsSAnZWagAAIUEP/1Az3vvEp1EoDFE24uJ/\nHknZJEplhcYBJvRpEQ4uD5FORVOJMfQ0xIae0fawpaZyq2SnvwxvpcSK4Qvq\nloMnOE3DiFnSlkKBzDSZBRjh2yURiJA3fj94HnuERgAgRgUbXxjpkLEaapcF\n9i85NjZAWsVWmrwN456+xFrOOyY3roQX2YjObF5hPqNiyVW8CGmitzKNQNSM\n8DVbsIfxwg9gsq0PCeAKQc6Do65A388PJWSJFO+2Jez2vCtWTO8P0LM0ruF4\nvDU5qiGBxfTg/QL/c8G6Z9tqgrs2jKqrYMzmZU5ph5+7+vR1yEHtvO6NoS0h\nTCinpeKOZnKxFiCzMvzA2Y4QdoMlv0XcZ5rd3MTJlSTvSaDqd8tZjqzVU8I/\naNeuBhtlr+bbvV8+l7oCchqrNBGIac+QUE5V4IaE3HzDYM0TFXQHYvV2OEV+\nZBfV+qyHM29Oj4DaQYpN005wtsxDWTLzpb+6joCqHdu857VgY7Sjq90horNP\nJgvtnetGD38B026aoAhKVPrJE5m89y/k2ZiXfN1p0GXuHOHHA3Lk6P9dYVtQ\n76BclLJ8lzdqg6AUPhcB1QeLzGI+G25sxjMQ2yt8/c1W4pnxVnFlfuwSxFoS\nAeSd1+fy6v+nCxYvzqN1PVfia9U76sUJ6sKjDIMgEeqtcqNRxBFjzmWnpuu5\nwgIb\r\n=Z+2z\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDaEEwSpZG8fGfjgSQH02vNrhjaUcJxGwz0tQL7If7ooQIgXUdtmArztsmnzdaZ37M760rJ0i3lHDVK3wHv5pAhvVY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.37_1572617954609_0.44989308328670563"},"_hasShrinkwrap":false},"0.10.2-alpha.38":{"name":"@react-ssr/nestjs-express","version":"0.10.2-alpha.38","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2-alpha.38+5b78d2a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5b78d2ab953a797a2a451edf78de9502a89e9e09","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.2-alpha.38","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ibXIOI9xAJAH6Ni/sos0cNahmKD4bsOADybKIeUY9d4EmqIKtVps52rgU1ebbBCtvSZxlTDbxPRuNIAO2Ffbxw==","shasum":"d92579492ba2092c02489fb7ee3b53ffae73d720","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2-alpha.38.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvD/bCRA9TVsSAnZWagAAaJcP/Rqi9+I6aPiIqBedtc12\nyR7/6GIsmOCuNVkGWwp7D/64EF38f+PYX1uIZx6Z5W0BDNsvYD5RJjMRx/G3\nuZaX9oAnbdBSUY1mDZta8jAtvo0+0Yl4Jq5hzkbORmXYl1odQeT073IW6QdQ\no4YZI/u+sAQq6d7d6+1gRIj8x6j9pnPKSCrgcjz7KpZgF7fxQ+fPHy+VVcqx\nBhGkM+Ow2Kla3ucbH/ZT5FchBwjzQ/oy1hYsNgYc3XoALvxfKgzqy88kdXg6\nwmGRqph/ih95gU61SUlpGObVDEIUuKSTLXLhIWO/EcsEzGmwOgdF9ADnlq7c\nol143dN8z/XMvZ466kio8TazzMSgIwO8MSPDoClJCcDScDqYSue1PSjjnhXS\nBZUoBZ3ehVtWQNaS+fl9ZgOZqRXw3zpShByRr89kW0hDLZ/7Ej5eil5tVwk1\nYtti5oYDbFewXDLZ7RTKdkjnuUOzYELV7+66xop94Vd2xoNaYqsNbvenRv+V\nNR/Wx394RhrT2rsnwoUsR79MsS4zM4PMDYVuHxw/N6ATPW9/97h9VP4jOt+b\nryni7Wk03RFoE7VF+w59VROwvjQ/Sp8zFU8xfchdFxzS12t+L90I+ErESHEW\nl/KnyPrvRaI7GXeoxHMXoiILMFug3hj0Ueu8mYU8cPyWUrMHPEE6NBCemiYd\nPfNN\r\n=lzDz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCVdj/K7Tx0FiNR9iZ3RUbRoIfi9YOr5dvhkcu5hkrZdgIgLLFu59hVhudQjSurK4Lvn01oxMHDjcTw6Anlsiwv870="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2-alpha.38_1572618202723_0.9676676404038858"},"_hasShrinkwrap":false},"0.10.2":{"name":"@react-ssr/nestjs-express","version":"0.10.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3ef018ad00ad9d166c94682ba554990d6527a344","_id":"@react-ssr/nestjs-express@0.10.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.1/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-xOS+dt/VMh9035rW/HCQ8s3LFkntgj1Hbt6M4FdLt7NQ/RRiOYgCWt5Kl6b4pviqJxB+UVvlFDpxqrEM4X7vGA==","shasum":"ad27096e3bf652b735db2c6d84911154a274b348","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.2.tgz","fileCount":8,"unpackedSize":13869,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvEDUCRA9TVsSAnZWagAAPmEP/iNt99gpmRPyf4z9clMg\ndzVrCY682E1C8Z5uSD31BS991cZQ2wTRWUF5mXOXqS16omBpL0E+UbNsgWNn\nPvfFPR8WJA5rcRQr64nUKXV/b3DR70LKKrp5OPYR7+2fSN8KtrbYedtX/nPO\nXRRHeyupD342fcEjhW/FMryQNk5mufvc6rnKXVclGQTDQX1wuNmEWzRwPAHr\nQpUJR4SHMGdiQkrcy/KMeC7LVgJ8CABaeeXOp3T/Hhj7uQ+0aeQcXPO0W61u\nVH39fg9W4IFuiU4tLEl8f6z+1TJzpPZW3o8+uzpEsL69xsCTQwh5wTw4pBBd\nzyzzeS2tDFJTtNXxYUigl4xNaWA5J/VBm2Ri+l/7Ue4iEqUlzGtP5RRckkyc\nfxSTaTfnbq4lDpaBRfHAd/3fSu5YKYzH45Pn68+23ePw7qHUFB9XfnDYT2ig\n68Pfrcse0CpBiGheGhR/UuN7+eqT43FkjoOB8qZuEIfYFAMk7CusEF+zBxxm\nqE8Gf8oxHtzzFzSmyPW40fFGiKYmBNSwcYKxkb8SBWcDqOpHh1NKNhhpI+yG\nd3SK1NUn9uXItyq1hWgZxQtaASRpGZ0Cb/mGrkr4Pyl7LTlLTCDMaxGquD69\nLKFPgMezCtrGo+4bSp6cjcImW4lGeTIzC+FLEBPTUgniWmkhwuc1Wnzd7gQ7\n9fVq\r\n=DPkY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIF12ukAQzuBgbOflJSTDkTTKuvrxVkb3qN7jrh8qddopAiBEUzJvrLHILVSeSHmzW1wstiZvvWX3n+BvLexTwIW9tg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.2_1572618451974_0.984011658742556"},"_hasShrinkwrap":false},"0.10.3":{"name":"@react-ssr/nestjs-express","version":"0.10.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"08b3184b7382dcdfd886dbfa4282441ded174ea7","_id":"@react-ssr/nestjs-express@0.10.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2uzNNCDFCio2qBRPiP/g0oZyyQe9cwc5u3l5N08k8GnaXvye/JD3SztEdM5sS9KgsoB5kItiLfcu+a7s7faYCw==","shasum":"d0a42f146ba585e6f1c3fd96a18a880e947839d2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.3.tgz","fileCount":8,"unpackedSize":13869,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvOMhCRA9TVsSAnZWagAA7vcP/1L6+Ebm1Rs+MkZL8agH\n/QhIcuVgvSk+csVAuFqvHCkzyOS9g/Md9S8LOlsoi5fgWR7aTTzPNMKsoWEb\nJPmSQWnjMHdP9P6hv0rQDKqHkoftZB47usHHxynxtRW+8K/lfkpvfOGTcA3Z\nH7f2jEJZ841SB1LlkqlA/cujLmRPki2xD3lOD/XcHvemgg/FoHy6EEpf+brU\nG05SeIdyAlfjX3BA5JI7Hie4nInipR+BOVLpYJAonWQU0ZU1hmFd1MiYQ3Ex\nWGGIrxlJ/k+bonP8cL1kXX25NKBi1Zw82cXlZGPZEgpsGgxiqSn1u4HsTDbU\nR5S8R7xwh4g+ohiukuOA+w2jYkPsIwRUNSZV7uhquGPxSLMliEO0gp+PEACi\n9KmvQONE1eojCdIOFVuPrHNL3YaasQqTqqy209XIbz2ORgYSX3qhiXAB4hp0\nFchCIBH1T+sNKEqDbDyRs05UCe+7Xs36MZgfXuzky5TBV+uw7HRFPQewLIri\nTwqcsJaX5wbKR6DgRZnS/crgX4L9dj5s3SCNaJ4lJ2A+VWnsDrnZJ39N3psS\nyk1oWWFz89/PHrh1VhfAmc5wXOPNGCPV0l2QtA+Y3TqR7DC/eKCLyE3EifS/\nJ3umRGtkzP5TmGJSVYfHcm/MXSlQWqVyRsR0ojcHqSBzmEAw2gk0oJeLP0b3\n97NS\r\n=4VoL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIG95n3iCKxe4T/dhPpfYK/E0NTuNw8Dhz8DSzt4FtI20AiEAjpE6gtYm9eNOKi4LbJaCaZu5ZyzvHM0Mv382O8c4R/Q="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.3_1572660001168_0.9624501151885159"},"_hasShrinkwrap":false},"0.10.4":{"name":"@react-ssr/nestjs-express","version":"0.10.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"036834932e760e1b5611aad2d7720728785552fd","_id":"@react-ssr/nestjs-express@0.10.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-OGOH1RSOmik/mQOH2VqEhAHX4dc4MLTTdVXEgmJ479HLWu9HRqRtct4KRgSRrqeSWRAHzEvsh6AmbCcI3gY7mg==","shasum":"c1c168a3cf2b3eb29b36500eccb053949b8f2596","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.4.tgz","fileCount":8,"unpackedSize":13869,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvOYaCRA9TVsSAnZWagAAmvAP/j+/3h/mw7xTHSmwLnzb\nP7OayYS7YjNODmnBqaEDaIhjIGv57U6mQnfl2Quc8u+mgAnRuL394B60J/fq\nA+plLPt/rAV73vLIEXuxBBGddcy5gqElSGAbi6PXRObYoZEIee15LkOEv2t9\nvdyTDBZZ3GHyAN1tBcQBlczu0no+sEhfU2hwN6N+5bNyqhQJ65R1AEY5QD8+\np3+/JBu2h6krDPN8e8grTJs1CkmiR2wQwV1V6MR/iFNRMyykg85it8TcHSC9\nQTRFxhcMKUH7vP+ODQaGYtF74jygzRdNKp4UaHy/uaCZqR5/qW0pWdvgatQG\nu1ChKvgRHi85WS/3o33/Zcry68O94Q+bKnCNe2w4phmS7agSdzSASlnbYa1N\nCKaJnkb7Mp8dh5xx0T3rjw1VDuK7VjTcntcfTKJy3yIpQkFdLyYAjVtuu6lh\nDE1zsutB8ZF5S2FDQa+zZhLPPVUkEueMJXG1xwoD026o0joetYLRloRBHw0V\nTC57wR5Zrww6DBz1Vw2UKooTb3POlwxMOpertWtra5qjeo1o4MrLLg1NVo0X\nPBnir6i8PkvF3iHBCNXJegVLiWP8AFFPxUHDqXoq6H0tRVTy3uElcGBberhU\n4LRiavj5jhom3yEqdVEE6Z6jw9lIIhiIp3vepYWAKAjtRSf9l7/PTgKdLIrf\nvjqt\r\n=ze8w\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEJU4J+Z1FU3DaVYVPd/iZeEm1JfKM92ZS4xRUC4nzWOAiEA8UmFFkGYGjK2eq1q6OwDP78R9MFPaYjthVU/8VG1nwk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.4_1572660761659_0.3133214753089264"},"_hasShrinkwrap":false},"0.10.5-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.1+c597629"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c5976299a9a91daff163745bee49b7ea0080a50f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bNAidNY6TROAW7f82bCNMJDexPMHQ+FRfUscN4EcXeHSK9JFXLWKtSOybCSiiEKO9d1WxZfbOrDIQeGN5Ysq8w==","shasum":"6ddfaa0a4fe65016246d15ff09c698a42dba72e8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.1.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvVk6CRA9TVsSAnZWagAAB0gP/182jGvUzlPq1QJEXguG\nKqi7yaOIK4F6dxjwVMJvLvGNFblPc2KAS+Xz4LyRC9u1qnKB9E9dWG8AVu1R\nTQKenttOXUnNW+41UhXXl7JDZSZZDhCSQwnneBAnxZWYwgju+QOBqEl7P8qk\nMsdpiALksddUadXneOTAkqtqQxpB3YQj78k1yIMSj6d/AUVv+Rs83fFRrtpA\nLKvst1QgP14/429y5+ToIwXRByhQBkCyGfeUEnlEwf3tI/x5Mn43R52Ff87n\nqlzkl5J/K7YpahJp5D2WOV/btG+KoheRILxB7XQYaaHlAU9lPhOkRY/t9DbF\njotqA0vRnKXyMYk0tKKxOm1dpgeNZXq1Yl2Q/VKyHRZpHddwyQPySKPposix\nEwaHh/jGWDU3C80wztbQE21WFEqf8fwcs60KEPdZDtOTnQcY+9u5iGTP3SE+\nd11LXTNg1QTv4Mh4atieAE3OIat1UOgMXSW/euXSnFZUXy1G7yD/BLrDcdQp\nZM0glsmEjDHiim/eFnkrR8uGgxWl8BRdzPyPE4Tk0ZRxWoY84/ZsLm5Xg4Ej\nqm17zuUSv/IGx3IeKj7xB1yZ5lNjGwArTyIxaNls2H4zWMEWqWLYg2vfRELf\n7UicWKfAH3GZtaGjDc5R0R3xCB/jK4+m/MOBcfSMhGJnW2d3m+bkRqGLDRhw\nlaDr\r\n=qW4/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH9g8GBU6kdcA3dyXwe9L509iKPK/neINHR9fTWSAsPWAiEAwfTJTPKj4XTB9ZE/qw0DZHXaomTJ3vnCN/NWOXv1MTk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.1_1572690234367_0.26791618489023405"},"_hasShrinkwrap":false},"0.10.5-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.2+bf75095"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"bf7509582979e168b81966d285de77b57faf0bfe","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-c6MmGH059udFm5DLdruchVMzMX61EEkzhp8nOd0NgHqa+KTz8P5P72Z3H6lRjLkoNHCSyiIswU0Yw3TSiSXnZQ==","shasum":"37fb3f1566d0e5c4408c8c0e9462eb42e5d7c598","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.2.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvVnVCRA9TVsSAnZWagAAK8sP/2BByTHd8q7G2rJZCooK\n0SWRUQ2NGlbYHh+RBPotNs0RMRfKV6tR0+On/t45VYC3uGSf4a0asV2gw/cK\nY4Hp85DrdBNJi0aofseODXDpotLHx4ibg0JhIw2GmVW5vLHDbRxYUX6PEAl9\n0VfHarkgPDmfHKUzWooDAXADFK2uMaiHNFlkM77OA+8dPL1UPJJGCW0HktmJ\nmsPRCL8+vLVwFiwL9fxXzFEyLyA9lOtMHNuior49WN3QLIMt16YLrNQoYouo\nm8njtQyERwwmK3hCTGNGMPnKnhBVdDsjyK31K993a5teqzedP9ZDQAd8NhXb\nK9PXsxA7wn3STrkq6xUjkz8ajTQdtDhWyTPUQglA3DYlfHQ3JOr+Hv83Si59\ns94RBjfCuu4m3GqDN7HVT8++L3hWaIkgqNCkO1qxTiZIGHhOqYyYg0+A0h2U\nJoHpg4HCwlE7TSk/0kCNjIcwnlkzup8xNIWWzB9sT01JVXIx8WAkKOfmaPRJ\nhZYXGdxEf0rVgYPUao2GcLflZ6iLQcGhj05fhYViT6NiEVKFyIX2VVnpbYGO\nJw38VQM38CTQtqVbEzd9eMbrKdEeQMkuywSa+2ukgy2E5FDXooucFYVfuFyq\n4u7u2aMPnFR2PgGQpk4rv9lN9TYVI1SndMApcXuUvCq3M+WnNYeItS7BR0W/\nLNVg\r\n=HndZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAt0ZBcogXKXZcIw5nhIWirzt4DT0gJFpGYYSvBNVJ7+AiA4XSM1qiXsxMx7E/cLKMFcxkAXz9auBAh47VuhZkjOCA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.2_1572690388944_0.9885059965691871"},"_hasShrinkwrap":false},"0.10.5-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.3+251ac11"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"251ac116eed75f21993f2c4bfbee7eba196b032b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-QOdV2DrJpS1ddXSrS9Mtv/bldPFke7bB/ZR5E2l3Cfdkq2lAbwVW7BTn1uUdQBmqIUnwMwM2xlk/nHKi9jCLEA==","shasum":"32fd4971d2a337dac24bc9823c7a51379afb9019","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.3.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvVpjCRA9TVsSAnZWagAADW0QAKCNqq5SGO0+SncCiDI0\n2dwfQ4XUeiqJFPKyFcl08mB7SSOCxFRFyg7JE3r73ZzccYY2t+3Eb2zHvH6T\n1WbIDby9c2tUPB+MkBVeuu4XBStU+O0i3Pa0m8ZutRH0s+Gik8Fl9zM4U2fv\nTwHUI63HlDfnoukUqWQ4jNCmqlYLWdhFMlnPGuS5BXuXos3i/ilEPY73K9EZ\n5jMSAtQ4/DDX3bwief9XpzmLMB7tRFVMRqjKvm85ZY9HWTqYCVq6SKv8b27V\nuWIRRubT2cOnWDdV+YWk3DDZqv0snMr+0ItnavK7wX8Exyuq11c91qiDCrI1\njDgK4CANi3FV0JdfY7qINC9JFad7hRVROwE+9iUEmt+7j4+S0QnCAXZojCt5\nuuAId+59qNFHoGD9hyr+JxX/fOsAV4l02HKEm3k8C4eQ08H/PXclExcP8YFz\ngvozQhpDjMgzktncyidUQa8UM+qecisYl5m87gpA2M7D0nnGFaMUC6H0upBz\nEDZXtHPpqSHpZH6WS74DCrN5VOMH64u8fTGI2ZiiSSLTSW9jYzvIoQC/8PkB\nWDJtlLWWSuamrDkVyl0jboo4HkjvcOD5E85QgRRnIpmDMkLE1w1B22+8kGeu\nRIH4G/6YFCJTHlVZQwxXZoxhhGlX1hw1k44Zn9AIUq1N0Z2V19v/s7ToTIp4\nHz2G\r\n=Hl61\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDQlHvPV/+U1A4PqYaFgrKXyHkekVYbyyR5tJfNwPDOWQIgL/lPXB3eHjy4Xm171eq+gqya15ZTVhWr7MelYXhWPNQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.3_1572690531422_0.1763981019001306"},"_hasShrinkwrap":false},"0.10.5-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.4+687347e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"687347ec2fa30900936ab6a20226a0cd4e3162d1","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-jJ6Jvxh2U+vxeqaE4caUbb+XuE+/z9zj7q1A4Myjm15RaB0fgr9h1CdgEgDkYYR8r4knfxPlBsdKcwqfiuwBqA==","shasum":"a3646af30a0cdf02676b11d4b4a826654d642c88","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.4.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvVrSCRA9TVsSAnZWagAARI8P/j5XiPRkC+FnFfcjK4pK\ngAWPKklgfGfzx5kvpMWHvyK+lzpT6uXdayL6h6w5dyzhbxjaaM9lu3CZ/QGo\n3jHhqwSwS+VdjGW+OynpBAC7JdlYPpsENZ6cwVSQ4jWMROcGWz1FgoDhcsZr\nLOxosF1PG2UYpC7E1k6qu2wQdBVy8jARyUChkfdw2sygyONSyR/2sXJotaBa\nytsP9dOOySZWBGKYWd92HcHjgEKCEUvdMAF8KT4vXcMXrkDLKFvdKD2Jbw5r\nSbK6sdGX+634iQppxnYyvV/p1+S7taKKRGkFs0Y6J1lFvaBYpwgBdjRjyDF/\nMEkp7YUHZcb60cFb6KAe3IMKh12ETNvYyG8bCAuAZWjhrenRT5l36R+AWTDZ\nlWj1/avM8y3WSUaa/YhR1j+IB+vbf0H+o/8sYnX0kwC0qLouJToT8VFtWBXL\npNiQuX8W/c+jIB8W0r2lRwV8FRtbJgMphO7/mFqSzHUKGvrdpqoM+4292vsl\nNz5yk4iyxXCsS6/ZWUE0KUP2TVFAVEoaFCVVEWfiy66BFtMupyG+GI//H7C3\nzo7nHmsPdAVPn8yepRQ3QlezUILy77ZL3MAkY+YqWFfuWwIxysiXFqCxro8D\neU8mdX0GGIpJnlNmdwEPTfUsQAdAn96o/bwtlNynyjVJH+v+ti8LI8IiSFXF\nce3q\r\n=ssDM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD0cDtPK8OPmOjJVfeHH9xrobWNOjBUyJbbrMZU3+wmPwIhAMBz03Y7LvY4Nr5RfKJOtOChfOXFevJYM7UqA+OzhDfh"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.4_1572690642623_0.964852793260865"},"_hasShrinkwrap":false},"0.10.5-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.5+2e62273"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2e62273d1ef061bca55b5ab840aa6d760c6c34b4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-gJIgRRyMJhIqDEH/7h5H+rdx7NQjADTxUM7hNi4W4bkw8sOZNp9fDHIe+sG1qdQM97DVr5dNmYgXWnK5EaCX+Q==","shasum":"d1ae67a6e58e30fa103ffdac96d64041a7aa2bd1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.5.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvVu7CRA9TVsSAnZWagAA/C0P/39gx/18F5uWgEghbpgV\n8qhYWqF7OMXxCWRIA+FSB6YL/CnrIotVPNUUSCJiWvBoeVDeSLNyIPeiOVQN\nEv9rurIfmNkYYvHyZPVhBT7cIsH1q2v5v0MQ3zdbDP3xgTlRd6oYjjKE8tX6\noYzbKwTn9bxUxHHEjsPyIYtZqq3U9p2Td3B620AJrFrlz5D5pZRIU8xUzg01\n6z0JWUiUCasjQUK+8IhFLcXdAQc+LXCitPHQQMPvogWY2Y+B2/2zc9rw+vwY\nKmXNF+qKGXZ8o/KzBj9KUKMMewK16dGzJJrlvn2zCtQ1/9gw9SacEFVfPdOW\nZNzjFFn+48fePzMWn+Bza4hsKVS23Rc9jWLoxjw4I9eZYRuOtkGLFbD/Ow3H\n5JDaUURPLpxT4n3Y8QrY2/oMLrd9MQoxvmDlPbDQpxu/6opW/IWlt+2HVFI+\nwyZPNTkUSWqh5IUoiiazyStjXwf8uwi6tR3IdwRMCqmbASDLw/QHkAfDHsFJ\npmukGX5dWmhDS3EE4M1aWd+h3UASRUWlQeq1VH6BXjcZEzt8QjtVZUyHmKJf\nmctb8OCsJe23BcjOwvx7Mze5uMvLhkeVTzan8lM2Lh2YC+O7DmeZaMer2h5W\n+L5A+ww+S9HkFSrLdefja3zfhGRBdf2a7FpJg7DR7hHhQM6s12CAUUJkUft7\nVlfS\r\n=tcPZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC+CXN/CCCv2phw1z0EyFJV57L4gh/Hde2c0nq7kXzVzAIhALHT8wym6q35rTZeAkniO/gGZ/SfkoCWipNLflDxpHDj"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.5_1572690874497_0.8507066453244645"},"_hasShrinkwrap":false},"0.10.5-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.6+7dd6b32"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7dd6b3208c721e5bccebb66bac7013438af817fc","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-p1Z0d3mMc9TBJv0HYIp3MRzRj+N80vWP1C5I5/mmqXEMAMWrY81s2K1rsDLoemVdcF/g+H9iw6uZL0QY5pdvVw==","shasum":"27b8e1e653217d56c6d886213099d6f6f5c7fe50","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.6.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvVwLCRA9TVsSAnZWagAADoYP/2FlaN2N2CTwPK3EiaKW\npFSUeI+I+8Ka9bTNaqx5yXrODHjsIUJSZrukstgTU7ttie1KXBtuNQni9zTg\nEe6ista9XSyTI8fZ0TC5PNfm1CD1iPgrcwwQlWI9iqRmiAdywKwzHNXgBL/0\nHYiZi51/NGIxELnySSDjdgK9zNwAJcI9AeZDH/vUgvw3IkWxxdp1JdVpkWyS\nPEyP3SSm6ceeVVhNeK0soca4R3yDqbJlbFg2Ejcw6d7AB5hJzSh+9oPc4maI\nkYQ8DwtnRet2dXLg/j5muqHW9702YSVKOQpHv3ZZXa/iOEnvEKkADYbhNyOq\n91JcMq+tFMyl9hlZE+jyBF8T1ks47Aq6OL4tdiCv+LI/Axy+mvmWpumdrtso\nejtksGULrLuPS119NmOc3I4RU0Iqi8ruMBtlQGNeanPQ7Hhg/+LfDeFktH6a\nzmWJhXhg/MGgZG8F7z+wVyIN7w4Z9j8LwWnzwNQuz5WEzVj0pXxxAu1ose0/\nl2rGYFe1ffvAo8KjhKVtaHg21nCC1+wFxiqnOIUBV4lmMXJLH77oZjYm6CYB\nmc8mKaSYjPnIu7V0aHOGHj24kDn7adtIfWZKWcYbhm0n06bXzqVJ3pURckjC\naD1jKL9Bmd8NjclTqEr7Ti3tyAgKnbJxvaD2KOcgJj4VF+/F9ELWI2hsSOEf\nnrCB\r\n=FLNB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDbgvCxuCl73M4qTQz6KJc39JBlTpyZABhOb+TuwPH8UgIhAPdecc3RRkEL0RMYE3xTSJO3vA/L7+1qrOXSxp6mm4J5"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.6_1572690955348_0.7374029597484872"},"_hasShrinkwrap":false},"0.10.5-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.7+4afa52a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4afa52a9b16a570dce7f1ff79dca981424e034b9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-+QIft0uSFf3xXbYVzbwIlLpoz1F22C7S0LG2CBdARLmm7LdJLVDc8T8sTT6K0CISznfFrOJijJg8k7kCRq2mkw==","shasum":"2dca0066945711e74d9eb12e85c8a8cf305ec667","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.7.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvVxwCRA9TVsSAnZWagAA4RUP/AulwvWK29M8XPe7Tszq\nbEN0pr1C3F7cN6RU5+EOt0U8PAafYOylHNA2djlSyqtsPDjY4XM44lI6XMLf\nyVaTZgZpMrWHPDIJZc0Wru4s5YNolK/EmsTIqhsHSv1jP/bHv4Q02fLPxniD\nlr7hGVpmEfY2bVMCRBqzPd8yS9dvyxZklzVuMt1RI+2AN/oTJhW6v+WBc4WJ\nzcdLxF++rRNkAvFkYQ+yPjlLR+iLJlMNh1j28vfUJfkhJP875fnvnwamCHTn\nLaTjHt2zWx+Sm2AYXFrOvBvKphIYPnthzN2VIL1aD2HHVUgCJi41xBWR1V3f\ndJ6H4RDcQYp/DdNcNQRR02M9dqBzu2t1GUf5Io8EGz/AJBUlt1DJf92cBvKT\nZZJsMPbYvwqJcX72ZOroahTxgxe8ZTgQmhOIejVR9jfiVwMixXnYvgyOnecr\nqsCcdATHRFPFc7fZNCzmoUXCNYr6Zw+K/A0ZZxq77Cp3Tez7CJXpfFAaoa9b\nrC3QAT0JjvLVPPqYoJrel3Kunk1Lm3IpHzlZbv/Qcra1wOX0cZNrm+FKnOWZ\nkNGPB5CjlxJhyEG9JiOGGbcWtmcZuv8f94ICt3eElZTTmw9VT4XLeUcBh/+9\nCeFdQbqOZd2syZyyIsFU05OkmGfMpZLU/LnQgZMDJpDZUPi08biQHE597Yrc\nNrQT\r\n=JUkb\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID2pCRqNJuDl/URPdMsCGe8cbkuqbO0LAorZOhDRNqCJAiAi4n9+N3tuRrA1zTNavBkWvAJ59EVMC4WoOmoTs5KmOQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.7_1572691056340_0.4082533664675294"},"_hasShrinkwrap":false},"0.10.5-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.8+6a99828"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6a99828de3dba9f565d3a5e4df51fcc001dded25","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-O0Gb0OLoKOlABHc/osNaaQCdwCAEuQYzCrDFMU4K/lWRPoutE1nhnBNI0mDQsLEsaE4n06tua/mBO18CWXSSYg==","shasum":"d2493ca4bbb8bb476f460416adf215f8c3fda143","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.8.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvVzLCRA9TVsSAnZWagAAyX8P/RrhXHSNNtIIKKGSQLbE\nMZbFct+lv2Ui7eQydGsqeG/W+sYYSYa78S/W2MHl3TIaocjC1JWPIBTLpVzG\nmR9rOZfjNWT+bdNx6jtd1ab9qEOG6LBX0bjb3gzUFyCekv9OQjNXCJAIEIyK\nx8yMcNYcqr9Wxk7UWE4VWbQ2JkvGZxmObU2/RGRw++aKPEE59d5esBW+blMy\nnKhVhLAO3pRjcKnFyEzNURHUKKK7I+pp7VsW4xiTnRQFREo2RcXXR7kQ8MSp\nR1ebp1MAoqrPEWWDPKT9j0OBfD8z4VPxwkyRGv7ki+FM0NIVLpiOhtZ4q6fJ\nWBfErpk8eJPcquSxW/HAczXiM5NbALLiNwpXyu/o5NLSieqoaEzEuFmMAcZz\n8Ovsm5Sj2dF0n30WHkd3nCtoycwQrRSjCRH996+5CIYWE6H8yoLAWhJ31Gab\naohXwV7qwV44yEQLrL20MPg0/DrU5Rhnk6GRP8aIH8c6S5xTwkBoaJg22+99\n2TdwcQSpcvd6rmJ6NcOafS0o8ZEHOEh3cpiYzIhAJ9lfGi1IYKNkyp36V+tN\n/EBfgwOU08oDc/LUJRBH1bNNOUtQGzdbSjhair/1qpfcZFnVRMoxTDJsXETA\nmNjJqNPouEHWz+MSroA9+ZyHQp8Dz3s8He35IkQ8G5iKBC/CA9slvcQgCLbT\nsY71\r\n=Zji1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGp29Wyqa17+nWD8T8a/69jJ+IokNDHs0zjzGcpecXzZAiEAuRcv4nH/xXhiA2A20aDOOOkmSHKUq/hWn/0rjaJ41ME="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.8_1572691146406_0.014709675314970916"},"_hasShrinkwrap":false},"0.10.5-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.9+26d0c98"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"26d0c9895b9587160545da544cb5c99b856faa01","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mo+j3P/Nyod+f2g59uVxnH09NwiSdqXJaYJ8egVQuZWYmd1KxiSpiMh043lEiGbx4fojW1SoP0ihZb7pKN29Dw==","shasum":"f16b598d555c39ecd4e8b9c7c7443ca88809eb0e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.9.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvV2nCRA9TVsSAnZWagAAD2sP/Aq53xxzOPdbctbsNvot\nwREZB3o9VEURTVmFRnqXrcQPYAkRMc5cVsOiRxDD9/m+mFbZByC6cywQT41M\nyWWO9Fkd76x2DFoztvD7EAnVo+q10ngw6GFG96E32r7LdaS9VSZdXrjbpq+O\n5qDW+utanf1d0FPy9AIDWaEiucauBfnIXKfwYbzJ5+1rJpfcnmwXyb6l0wxj\nd9HXLlZ00FxLyTnxxyHUEheSnxl2C2E1LdVWAJsMl874OgNGyHD8muPdjtRh\nRQjPgQ1WX3PQGfnc6I5zuPn/pS36D0Ux/ed2jYhyELNsDBPlmWJfwkgDZjVv\nmfLNA0xt5Veis2/q3HpMcHmOLrXaA/vd701VYjOii+UoFrKQgocR362OsMdP\nASeBR/nkeyFl8dBp5iKsszqRwmObINl2eeDtX/ocEmHYSp9ThusTPNXQLkCT\neV4yYKqt4pR5uYHDXmgZPH3DJ7I9pLvYQP+k7kGpaWh/RdffqhurO3BPspwX\nC0+Emt8Ck0DVQD94ynV6/SVgmO2k/Lz3lRBwB3qoibjmFa45+Q57+QTiQIj9\nXp7zlJt1Dgaslf/iAHQIUgEsOGn2ol6mGeVoBLk9dqmaVbQnIiVVq+Fy8sZL\n/oKqXfmy2mlcPvsDqGy0LpIj2qo4Wryxjv5b30waN4WZn3oVpY3056ejno8Q\nGUin\r\n=F68l\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCD0qvDF12PRkFZBDR2UPI5ii9MJvT987mvTLRaEFzTDAIhANxBD9DfA6MQFG6XBsBZRRpyrn+RU0ic9ukpVrH6/Uv4"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.9_1572691367144_0.48259842517935647"},"_hasShrinkwrap":false},"0.10.5-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.11+f794f56"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f794f5601c4331248d701b35c248fa0b6f3add91","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-a1AL8+MB1ZyI4J2+h9lNc5n1Y/5w4LBdhPKPN576jUMo3BHnx1SFeNoKspxFvQZNYwNmyJjaqzTYg4VA+SStog==","shasum":"8f3df1763b5b2a1692c6930ef68e725049b55584","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.11.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvV/UCRA9TVsSAnZWagAAEfAP/iQkTcTF8WOAUfI0mjyE\n41db7fGGnmVJ5TqdF0Y2pKd8D1my8QQbbV1wUwaFuyYfMi//CSSSz4I8GKCQ\nrsRmVxvbqmzfBN8qApuiOfwgVJDZDTMKg2pJaVkB//YyD+hgR1ctlz8SU1Rh\nAiTRKn7fuwNqYLg2zW95qCOn39TMAukSTJ7VhV6O3gpdPnbyJGlRsX0qzPn0\n357e/mcvKyTNObQTfo0l3U5R0gdIHX3dK+rWr3fX3xj3RdEf8gKRNZtbZ2eB\nM3qD+Xq6q8bOFTYGQeUmNRVhs0J5T+9bB7l4cJx59PbpDog+G0fvz9NeGEoP\nkxfKr/3XSyQAR9/xlhVyWzacC1q4KhfknRhAJTcaLJ4YaM2aRLS3vu8IZ6C5\n+oAbhxg1JUbwooWSjCkkWUEv8UvBM3Bra8Cwc4ZQk6wtjNENIAdl7rGY/2lj\nsv8fr4nrLZP0sO9h2sVaH9D3meflngJG9Yt8Kiil+/Vyk75QsOzJPnXDmuFw\nzHJUa0D4UcekJCfMOI9TbKAZBAEzEVMDbOmwF1VBZrhum3dD9PglYZ22CP0W\nWNNolu2xAR8hnfGbN3QvEr9wTYgrgkQZUT4UQVkVuTgdqibUy4dap0s9c+ib\neEu+D6SXtxlLNbrEa2ihRQrwebTJWyBiPtC7l0ViDGD30MJJUYqbwTnf41Rz\ni1SL\r\n=El/Y\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCBaWYWB5C9gC0ikxYWJUYKi9eAif7L/SZqrOjZyGHUoAIhAPeOvm55zuNOBl3+/PBu8yY/7oOdwrzWHvYsfkDO5zVp"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.11_1572691923771_0.44242131330857215"},"_hasShrinkwrap":false},"0.10.5-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.12+4b6f378"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4b6f3782d021c59273b37577274983cdd8725f0c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GU5pZOJ+y2UfC9Az9qx5iQGb4ARQUklhJVFjNSg1xnlzgcg2MRNssnA668z1KNbtC9L4S4ppd7FzXdSQ9AJwJg==","shasum":"c1c0d6d519e52e6b02e664bde2b25a5fb73a8a21","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.12.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvWCYCRA9TVsSAnZWagAAa3UQAIpe8tuI1I/XpwHDwAAG\nsx+FRhTOFktJTUec9CQuEaUSJcCC4uGJXIKQSs+a9+MqeyxgI38qKlchInEM\nwzZompzKa6PwJk+ZrMVIFlKVekmdu2NTcgId2J0xbkRR01ZozgJNpECVfwxO\ndBNRBQasb6s2hBqnD5D4Zj3/svt4MK2VXgzlNHVLiku/mz4xrJBHzKjMGw6l\nAUXPTlq13WJ8xuqNfBbr0Cur9QDUnGgwU+brgTp9LaMe8z/qEhJVp5F9S3dV\nEqa0nG9u8x0U6FuZY2h/z6wTOfbWJhvHyLqr2qGT6VaCb++tqHKBfnQJzIgs\nRAcnVFPVxUxe3VEJiVM3ZZd6PwmFC6jfdRLiQ7bcVyzOfA9jUQiPwFzx0Bfx\nEEd4unhTp9DU41kkm2ueaJHfbzxTq7uTK+nOk2itBdzBc0wVdBE6+EZwJzgA\nFNdMQjy+ErHXK/U4GGT5Gv+iVMR4qJZ7w1yNOlw0Q2Y+dLAVME0GIdVrrnD9\nQ22VWYjMbNwuMxWQI8XVA9U89xSEkZO00SYJZvNnXkwOWt9mRe5KPY+6ZCHr\nv1CZjLmoQGZLWXfjlphu3QyBbuicGMbYgxsH5RPpuEe0qhchqFm87GA/O29j\nyBCw1eH/ofIYoiLWNv4/BZ9WY3qGOwjMhkW1W/LDZAeNIlvE/jzdSqZ+XE3j\na5qW\r\n=Z5tO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBTzGUsW7T2PldeFzQ/lB2QGcy7P2Ucw7yiDfpwg58AwAiBEEDwtXT5M0DKXh636WcsslJ9eCrNXFqjT5SO3NIFXUg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.12_1572692120489_0.4715443053350483"},"_hasShrinkwrap":false},"0.10.5-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.13+62fa993"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"62fa993f47cc46d346af2ba6b389d4799252ee02","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-VUM280ZvSlimgTJVpIgLmcrMI5x6juy2HgA43nq8URIC/qXPusol4o9dW5Mf/K5FQy8Y7GOrhMC4zIKL2T+kGQ==","shasum":"4c19258b66f981af7850090f183415ce4b6e6883","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.13.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvWEPCRA9TVsSAnZWagAA2ZgP/1Gee/SxdNu5yli3mE1A\ngfTja/IrLk6FE+7b6goQ7FSNJiLU2IrOZkQUMybIGboCAJlWWZTwJy6j3T2U\nuenp6IUCZVp+ke3hZHUFuJz6nkccoqErAEuhEjYR28cVu97g8wMHoSWKg56V\nTzaMGXQQlnMSdLe5Nf8pxlcyMuX3WPFvT+DS3ALC5sWBxXZVC/9I1wxOKKk9\nNis/ScAy2k2UEC9SM5RZpMzlv1Z9SayI07A328aWq+Ks2gHbSV89hH7BSCdp\n1W8u5WPom0QcSdKq6tJss1JJJWXbjWvrTtpTiqW0il5jE3VNUaK3SV24VWms\ngwz9MbXDt8kSzmQWPsG2AcmR0ZaQZE2KeD1oOYJTZfMDapYWL8EyGMBkvdCD\nK0G0FmgpGa6FDxBwM9w/znkyydrgFQs6GIJbXWJrb9mmkTiuZIzsawTCGmpX\n58JGifgb+hE0ek97zxwf4sTjaNJXdwDntKu+R7i4wdH+udJJWiSYOzJehckH\nT5qHD7mb/D98WpuJmyLguOl8BZoBzYHUEawBUAbMZlziPZo/723YC0oQ/rth\n6yLw5gXKhAg9FwyDdlkJ9V8ImUOQAkzFqXdQkUNTM/mtkXSpFG86Z3lmy1+x\nA7jx3dYECVejz28N4q8I6Rb3aNnDk/olv3pihh+Yz6YWgSQve9DxA1ho5soP\nrlOT\r\n=6w8Y\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEvIqVRBadAxpfxsvEKF4PstP11vHA0Oa4RkvJll1CcyAiEA4QI64QvE8P+fx4C9mpfMPfWQe2lNkqAd8Kt96+kxQb8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.13_1572692238560_0.32348142346940234"},"_hasShrinkwrap":false},"0.10.5-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.14+e14ae36"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e14ae364f57b243055c5d85a31dc7ab30f926204","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Z/+/Gu4DrjnqbE6RKQkStLZ/mcSJaH/6027TdjhfCi7xjvsaeSu7dLiALBDA44a+QhwaHRipymB5NhzJkYtBmg==","shasum":"72cc078f17a8a56ec558464aa3eacff9785bd02d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.14.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvWGyCRA9TVsSAnZWagAA2AQP/R9OsU+OjZMuOQPbhvSA\n8By7ErtK1ctg89ZZRG0wzmyp1j5huAqVjX2ruti1r5bnqyP3s6sCrcCWXRg9\nJya1NuleKZ8z17AJQSAKJKBp+5x53u5VfFuDQWv4Jtx+G0uZpMXPhzFycRh6\n4bNy/hF/goEt+AwsZtMxvrZSjERypaXkbf+1oWRxn16oI2Rk6oyvZEazEm8V\nAL5FKNJD0YcqQqDRP6UZF+k5SjAooSQCcpciMUvtCqrnS6lr2q0cVyfsBEV/\nrKdfehXUYbZMU5CyIeK2xGB7/DWJWXaCgPDLPKKfr7xASGKcv74uN/fHgR0a\nYDE5pSkiblsKAECTgNhXKT4+VlIYvnKsLT7HYUynky/4sTEvyZK1gvLJibWc\nu6yhCBlAsXG7NpxhvdPK0tApilWLKnhFPS0kuTSdDZlc2IjC8sKf0yhiPKyK\n6yMsTA1tLNXXjzckKBTvDQaZasU0/Kga6v/PGn43YPegL6vPvYMUbCs/mvmx\nxxQDjtI5u85sEyCII6FNme+ligDizPKYNNqUF5+rVQubX9/BwvQAA8sPOWpd\nkg8xDKI8/8rRG+l8SENPPgdb3abaxu8OQsk8+bFQeGPtiNH1RwYzNp/MciiY\nAlVv1aFESUB42Wd9QHW0D29Ubl9JyL6QmbxsaR/7+q1+SmzNWddr4AprqvM2\n/aKo\r\n=akzA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID7FwmOR3rB8IYPEDDBsxU90biE3OtIdRRXIz7diHE+4AiEA4FfoEv5V3u1g9dxAUOJ1ecDbx7e9j2X0vsI/fgUB4Bg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.14_1572692401988_0.8727440113516465"},"_hasShrinkwrap":false},"0.10.5-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.15+485c35f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"485c35f1d85eef31b6127c10a7f2c214baa31fcb","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-A8q3cgb2lr3JFo54gDMyylERueV2aeALM7XBQrXM1z0MjqAJare6uhTNF54zRMLDaO5BurmJ+7QKjaNLZGyPYA==","shasum":"bc97ef6bb7fb653c559892fdf57210d3d21587d7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.15.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvWKlCRA9TVsSAnZWagAAVcYP/0TPYjGPTCbJDCGj/Dhf\nOb1jjXm2Shq4WFH8VEJR9bQEp8zTPW83GZHWjk9xVvfumkNw3QznDuj8nupJ\nNwwKzewJarsSkmgQhT8l0lwz3yYSvCVV3YLkDSGwOIFX93UhOqmNrq2CEjAC\n+Tt/2+NpW7nXDQYDAD/6uQvNZVFiuPy8zGhTqCrIgpIgD6PbBbhkwY5SYoVh\nPTmbSgX4wKhAYLAKJVfwkVaqIoIZsO7VCoKO1ZJIdtxoJEr0f1iQVEXKCl/7\n8Vypm1rx9nIHioPAjm3G8Xn0nktx4pOSMTY9oJ8CdfbD/wH/m7Ge7BoIoeoi\n+palCSF8g3oA3DuFFyv+lNbqyLSDmefZmT9FQSgTTxteo4Ozeb8KxtJ2H3mc\n5BOwpIEOvuTiybeZ/NTqA9lzP9R1ANr7R+0lrGWV79cXtAb01j3AXiYafmIY\nLxHXMRg0/MFqpWVuwS+9okBvGwN1bFOR+/C/DSUgBnOuFihLlgEx+/RmwQu1\noenr+rjOg5ieZxCbahqu3JgNzsHxpOBPxAjkIfSuUVCJab0FXFcLgJxpl2B1\nIz1IlWwm4KibclCy3u7iidK7qQgpjZJ0mymt9LQGe2kgGkGzU4PSzVY47PfY\naDs5/v05Qk+uQqybG6R4/QYx5TW51OZF7X17/zuqXVdYFgmC/I+Xq1qPDaSB\nJqoX\r\n=eaf7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCWYVIZamEtNlSNYok1/c0f+vNq0vwp1Qnr/KMLYomTzQIgM3GzmJvSjE5osJjk9Ac/xgLfltDQCg7M6PUCJ6qkEUE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.15_1572692645244_0.29083710760576476"},"_hasShrinkwrap":false},"0.10.5-alpha.16":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.16+65af211"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"65af21136cc06dfb88c0caed9d63de7880807891","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.16","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bHBCcQtP+K73J3nvN5DDkDOJjQTpOc3SYaR4UcBgXFkv47I4ZzvGGKc74n1dnxpxTR2LpmT9n38Rcp79Y27p8A==","shasum":"b93efbdf9e65d3b120e790abd9c0c7b52a9cbc97","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.16.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvWRNCRA9TVsSAnZWagAA7iMP/2ZrNy0mzFdXIkNAXCXu\nfkV+nBgcqQ/lFqiczt5dadmIfbUq+bRgrKmQWmEiBpd34W7jhTTwV+nNDswD\ndtdmE/vJa3gN462T9lzGvhn4evJLZtyxFEdeKWgSC1E+VfrjfLqsQ8wc0nG6\nYIO1bAn59/OVZ+2fRFAaLap3Rf9PvxyGp0x5qlz+u4BbLLB8uhXQcqnA91JR\ndCdj40kWrDAr2YHSCn9GzR9ONwb5103pQqYCEaWk84LzROS3CD5FcEJpOhaM\n+X6AI980G8Mev4zWqoXnXSLeBDdBrDLgWPOjV9HuN2G/eSr0uE0+KJw5nA4Y\nyDEaq22C1+d8oEv14lBsPCyENRLugk93q9VMlrcB5xrnua/wJf2dhohEeTEr\n1GfYqLMpBVEWxVKm6JrP9ZxzsKS7Lj50fR+Svq0xgekYMM7ODSDau8MsOdJL\n3d/+ro7an8QKY8v5LZ0eFthHmyxtdkA5nz4nsLP/+6Lpy3qclGE65wSpa9F0\njSqMpUClWOpdqetrjlXoMM4DeK5Svo4jC9hCa/EH4t1JtirZYtJcncny2h+z\nuTULk/paoQdrF7m20VubCy0vYl/OcxvKGZ4mWQ/x2Y/oeDe+GTDHR1hV9MEG\nrtqGIJv4RBnsmNawrUrvvNd7cjRA73twRqIU4YBIw1y86viUx7tfw+SzB3/P\njEan\r\n=a+Vz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDC6vaFe4v/jaeuyR1Slj80qT1atcY89e9ZJ9z/E/bsyAIhANQm1JsVM9VpckXEnY1U37m6YceonYbgeoC9z2amqonc"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.16_1572693068965_0.637815755886288"},"_hasShrinkwrap":false},"0.10.5-alpha.17":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.17+43c6005"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"43c6005cf08ebc2c69542bc7a95055471f8f550a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.17","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-o2DqNMt5cjnx5sCH/wwFP+SnLEYABPbK3fWsOsij/FStzyVqfKhV4F96Y6l4oBqsE47/gxC0HIN8iLiZf+Nb5g==","shasum":"5ec2571b9a62253720ebbb948e7551e3fd0d3fef","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.17.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvWZCCRA9TVsSAnZWagAAvMMP+gKT5102c4AvYAm6mEd6\nw9pVDYWToOjqIPi7zCARoL6dR2Lw68UDCSVDOPhL3TUdMiJkJRJeEghRaPBf\nuWlOKramDJDpwoloh2kYYASsWoRE9CTJsAN/ZahS7R+/LjjAKqvSbYELCnh2\nVia0hZm7nYZUYYuiu/qUgWp/abJSYBxRl5l4Y4WfCCT3op61jUH7QZehFuJo\n+TjSMFDiWwjPUGky2lUErEoiDnoA8kJb++C9IXG89MhSRVuwFm+MruM7Cxqc\nTuLuJh8j/iedwISvRaYE6K7JMInjYGptRv+LwrQB3SH1IMCfFvMBh3vfO/9Z\n0awh9SQaAk8ctN1HXXI7fADGYw7hs1K+wY8ayCduBAGy1NAc5tCAt1r/Ose8\nmpBeSICf8UUi3C+MjVrEcKGmngssr/rTjjxVEjP20iFn+/vohcA987f7lNuS\nqhTbZW45Qhw91bpc5H4TdNcy9sm414v/a0dcMutqRRarsIP/MQtHmj3Fb9hM\n1RrvL9hdJ+KgUQmIWjTSxJHDJ3JTquiPi8hMplPLqWgVTbxvCMoEe4s4qJ64\nUen9wOEIn2/V3LoSiwWRDzrn6PRNU9y1aOr8fheRsHna7pmCi6N39GQVVBtJ\nlXUV6R1kTaKcJW0+4rUka9oEdLPNabvztwi+P8iniCp3gKu1zUYjrottSSDt\nv2aB\r\n=IXlM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDvG6pIOkOsLx/eltypyD4541iMSKo2XikM0ij8WxuftAiEA4ZqkXvHzomlzkcwxuQ0VYTWJYW6D5lB+Sq2u6c/OGY4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.17_1572693569663_0.8870242729994526"},"_hasShrinkwrap":false},"0.10.5-alpha.18":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.18+6bd69b2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6bd69b2b30c65e690f4a71a8544752c4feb6e038","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.18","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-zqCuysBdBFVEFQLv0J1HEjbLufWKO6yn5iFmplNRZoQfeLjn+U3V7FzLNczNPS1FwN7Fw/RmgCBDG2PVnTD+OQ==","shasum":"bbf6f58041a39a7918ab1c8fcd804e9b52bdf6d5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.18.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvXA3CRA9TVsSAnZWagAA6nkP/3iRpWStmXwQg2MgWKRa\nAvILymM/zHDOElwrfX4Ad5gnfVY4UxgQIHxyUs+ZU5Y3cmPcx3jobqYuJeib\n8t3HpD6eTi0BJXKfp0hMAxEpIfrtQT7U7iHIHtrhwnlWPrPxg1giw3K+XgcG\nG10tSAOFAPMKlx3ro/o+Cxur/oUbS0T+0y3/IibEtdwZ56IJagc2qiwIWeEx\n7fBKVputG+74DilmGVe1BksMRCVWe8WFW9KkbfJYoWBzizg+H2RCNS2SmgEG\na8gX4T3Bo6M/SI3pjH2V7pYvL+Pewwm4Q3dLt7BfxSw82b8aEUo63XSIREjl\n8ClI3tA98I/B3FC0jmQ+bhqXoSQTIV2KcAM5A57ulqBjkybpaKoM84Sena3b\noJOTCQV+CHcwpFWodADGs6GrdgivSIS5nV7ebfnvj+wRtbRyFKGHrJNJv8iE\nkoRnMVKF6wLYAlLCRpYgG9qUHHVXXAw6UdhpJOP8scSV7EUUjJt5p+47cTWa\ni//mhMhTmAqr+4hYofY2cTQzRJWH7UUWC/W64oeYYMrcO7+g3CzfTm2SRRky\nbwBQfiC8KzexpUGP41vS5StcGHwN7DNn0zkDqZpOiEkDI3zl5LXGjefDGFCg\nYNkuTPigs8YhgeOvo0l8uyV7lCtF0E99Mu7iaXPP0DIJraoYX2TDsvgwe6k9\n1WSf\r\n=uTWf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCOJTSkCjHHIm1oqEXPTMDgS6sMbwG/QBSWDj4lzy8/xAIgZzXbPckC3+9fgWPaFZ1SXOrBKQGtl9lp98D3s8ife3Y="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.18_1572696118714_0.7950709079060321"},"_hasShrinkwrap":false},"0.10.5-alpha.19":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.19+51317de"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"51317de17a57d2a56dd0d171002e57c81381fe54","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.19","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Ff01B6FlDYI6zGUiPyprR1E4jOyAl2/rUVogziCRrq5d7rl2gKDruvrcIq/eoLoYZvykTQ++XA3ZPX31l7WFTQ==","shasum":"46a71247b72dd6d28fedf4503449e314cc8ceb57","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.19.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvXGQCRA9TVsSAnZWagAASUQP/3nr2HOND5m+V8Vc6GL6\nx1Q0tTS4C4rB/9UBHrU/Mc9qGpV8Jp21pMcEdcbjDF0K3rLYvOlRS8F5Gexd\nzeNxshmAFUSvtQ9fiisttuYkE9RJMWIUYw18hULRECZIkztJF0Vc5bBZysGt\nhNYEy2J5ur/+HqPWhe5FaFpglPXtav3HmxLnIWUD2gzb6RsICDXlD7he3sEP\nj0A/C7E+zzGXYxQmM3ZldlpaHgeZUwvTnH+dpw+n9NifnCbYOJ4Nv/kJ2JmY\nm8blKTqXG3ydZU+pwHtalue4d1vm8u8yGfWiNUiP0x8eBkngm63AewS/Xbd4\nNG2U8S9MnXdWw8Wa2NWNViwEPQUatquRs1dVp4uBenDmYRI+fw+zSC0AUDQI\n/FCi7sDaqmFU9wcPl3CEv8ZA6sayzr0hy0BhCu/q9z92g3CmoIAx+BZG3AkE\nZztwXYBUYW/Crg2lIIH6MBDCK/KCojy7cCzz03JSPfLGmGEYom8HUgdVKSZg\n1fRDgPhYbR7883Qvt3DWZata1hrT+DquO6AG5rbrYU/rht4tXkQ8LzWoou/M\n6h2D6jh7RJJb5TkhkPIlvCSVM+WelYnwYgVc2h3YA1aSbJsJYZr2PKQeX9EC\nyTmv+vL13Lp4I++lA+s/hrzHK3NM8hs9IwR1erNVTqqkUlCmqMC60n3OwVSj\neULd\r\n=9ekJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID0vHLADttWsl4gjQ0BpCbETYJCy0t+rm/i0JD1JmJSWAiEAkuUUgQaeZI8RIwyDLtYCoiufNsvfXvFyuPtoMbMelIA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.19_1572696464472_0.9281157168206402"},"_hasShrinkwrap":false},"0.10.5-alpha.20":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.20+5d70f64"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5d70f647b036a20eb7739147bae3779c1076f36c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.20","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-lCB4By4EeLB87dAOav+FeHN+bWa70vhczv2LbLmAOj7DOO55zAaX1H8r64u5BRWaKLyVJRK3eqCqk6bJk658eQ==","shasum":"295f4469080156d825438db273640786b33c492c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.20.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvXJyCRA9TVsSAnZWagAAWrkQAIxN+2iNVMaqCFf4Aatr\nimCdGcmlNlPc0KL7nIsLmsK3K4zDMHWwN5fy+tPW+AFLfIUS6tD5daMUFzzD\nMzjwEl76fr9+DvRpGfL1vQwdW+dUBubauOfVDgGPC83nWOIm+1xS3/Pt5fIO\nm6kZEs/otJKxrjovutX0GrM+Z9uKjYJHMHxTLpekFx1PSKe3P7dn+Kzn8+iw\noRDeOtBR20dmUBbN7ho4AoYiZ8N00NY5X+OtW7b4xhNYReExW2GFXu5Pjh6G\nnuTorECIn282AjAyHjSLGKisMs+dpAqK9Zv5sanZQtrk7SHvLwRdFqFhHRE6\nJG8S7iTFKZbexqArMHBhcGbUtf0F5crfuGWryGDm1q0XVIupb5EFyYxqNusY\nj69KvPCB/pTSTPNvymoxV8YuDgppqnC1+sMYf1/WFyCz6IxGwqVg6fLfDRYh\nFgaoag1sTequmaWv31h+m+eHBhrf/LBf9hRM7XzgFM6orGbroMnJVQkPWt0c\ndPJHrptz9Q3xyCAM/OsyJwHppir3P3wFzXbD01YArJfT5mdjubLlleVu6cXy\nKnxJQi56CtCztFiyVb+9T1hcQIXPftT4iWhzzXx9a1rwC3e2LhvqSRJhPZEQ\n93WifzAdC6yEN0Ck+8RTMZq/NK1UvlpXVTjHGTIUWnnq1A2zxhQyGgnnN9Ua\nuuvT\r\n=Tojv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIERJc1aK9F0FDoqqK8Lnt2AAet82U69O0kP+L+Sz1B2QAiA2E15/0dy+CJyT+1b0wcfdeh8KePY7D7sM4PTEEAtA5w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.20_1572696689981_0.4417583934756619"},"_hasShrinkwrap":false},"0.10.5-alpha.21":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.21+1ff7848"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1ff78480b8bc8af3fd56c254e964ac42af39c380","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.21","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-LhmEsij3+5RP6g/Jfuzd8daOuvY9L77mHLnTqrCSYjSR3jE/HaC5T7htSJufy5YQxh/PIRW3mvflAeZDDzb7pw==","shasum":"bfe0f1f628e8fdffdb841042c39374d57556694c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.21.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvXMiCRA9TVsSAnZWagAAzugP/174SWERtptoLsvKZSP0\nZN8N2u/iFzNvd7ROfFR3xjnvN94RhJ578yRvadFn4lw5/GsLNEB9GnWDdwKO\nTBzzPscf4dkZBv38VDZtUde8d4nsW8ZGTQUysWAKLAbw3Uj6zwQZsghBwg32\nJhVWG0NM2tbQxD443g6Fk8akFjh6RXpezQiXAB+/4hBnm+ieuFsrHRb2pNUo\nj/ZG8+ySlVZGuFBxRsoe3EqzMI5DGYvUjKaM61iS2YaPQGvd9R+RL1fuY3Y3\nQnUSHep2Q1VkjAbPl80BlBxXzaQ8Bsf0HiBXViejPFfygpEnIEnpXgPvZqy1\nmy9VQJJm8fcXXWZkmJpyK1dCLkioEPh6wAzgoyFTnlZttUavqQpShBFG6CDc\n+DJsKlkV2p8Duq758LYmsBoUrdi2Y7ofdixWpLvQR6S6WvCaoATKy6dGhg2r\nhwSkro5+asyx3SU1eGVrWiW1hFWnyZ/MTwya18tjkTp3HpWXhPQs3fCJR15I\npBRqGqzncrowelAuChRrBsoHg7mrCxg2tkHBxOtPGy0YqX6PV0hJz/AjcZ4v\nVDVEyZDKMKXqficzaz/z23eg4LpYkihhedbfmrngFkeaxRMf8eJe/NQW5eed\nsTG16lL7UtZG0IDlHlVNV2xGglCfr9hbztjcQyatOx9cKPCU9U2RV6tO1Ad9\nS0mn\r\n=fDcl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHPS2duie6ytUPOSz5g+iP1LN/FmVRYbLPk4qAemRLvgAiA2hWtNwvVCQdq/X2/Ws3nGXbXVGMPC1lenTEtNdUAt7A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.21_1572696866314_0.8823834168913172"},"_hasShrinkwrap":false},"0.10.5-alpha.22":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.22+29b882a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"29b882aa73c00a2060b7c15a7c560f55b03c8e2e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.22","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-+0/EKi7lT4H2B/onxKVFQKL7+/KMQ6ib8qX+e30zghzPt3IjpENH/Xh7tGQtcbG18u/2CXR4I4AdBY4G+s8yjA==","shasum":"c156aa8b8de169984bd5541da0bb7862e2078619","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.22.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvXOXCRA9TVsSAnZWagAAj5wP/AparTdn5mHpfLbGsSoc\n8ppvjVOG1QXHqgklbxZGObHs834tKZof2MckppKWb0oa5HFUWJi/2nPd+vJ8\nh2CuHQT8SvNspqzqRuVZcr2aGVValGPtyTz+laP0824fRRsp+B1HRXZBPlgA\nhH4ENEUUpmoPou4hLB9hFzFKD3teIkQXzbYEUbvB8K79mgaWhwUjO3O/eWJM\ndySf3vduAhxpKz7NhB3pSlCL7Bo7xuqqDe7Tn5E7AjpMIUe1FVifZkPHM2oj\nq/3p6xRMKUKI1TZFqr1VlXDDSugOTkTXNqxMZtO557IsSOJRVDUI4ze07IGr\nRCHNQ9Y2dFYhUPQ/TJrqQfpLrU3xl0kpT/TBpa1/NygIyDfRLuvhhN1UOAAV\nfJks/DLnFsu7ZAkYmImvIUjrzWSQWw83Vt7dwZcUkbgAZGwSSF+49S9uX0EB\nJKY2FmUTL+/IjFxpv6BePW1g6+AOHO+sa6UpM9Mqy9XM3WOrzF61yi1oWBvF\ndZwtFf4uig4pteD/wJtNsffcHIiR0B2kooLSpw2A1gcVXbdiLit26JxI91Dd\n1IffJhr5HoiQxogktFH5yKp9p+fbQTdj0BKiC5DYi8cVNS3rB7wI02PVdpym\nf0+iR8MYv3eUZETl1675XZG8CFZO9QlCiwlstphkEyRahzhvW7BGxWbMUkC9\nio6F\r\n=RZwp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDswq8y6dLCrYOsDpXMdaeeI7Qm99aDwvv5MP/CeBqgeAIgQrEN7ZzR1mvV641HRN7P5Ox97WQPHYaMwnNR7Ou2SRI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.22_1572696983465_0.28349055112172716"},"_hasShrinkwrap":false},"0.10.5-alpha.23":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.23","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.23+d21a925"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d21a9254cab9a9d358bda7fb14af1406c3f53ac3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.23","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-L4JVf4/KC3KPx1VZfku9CXN6koPmySwl4NZkSZlUnF1jEBYyYWEhqvb7kDkWSTq5k5O5QEDNZBDUuxG/XznkTg==","shasum":"947d8e598291416073940a483a9127ec011243b9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.23.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvXXZCRA9TVsSAnZWagAAysQP/1RMNvjel7PDUCq4+QuN\nmYqZuoIVwUuXXQFSAnDxvS1pYINzPpQuX8aHblS+QakuROMaqkYgxeax8VAh\nwo3iD86n7i1KT0KiZ576K7RrMwTjDz/gALPvihzbpcvTM0c1vyB0rFUutRM6\nQ5wUC2nJpDRcZ5WqNZq6/GYqxmTzpjwp6gDL7nKn98LXZVbQffjtJtvBVqpt\nflQxz+mnUqBjuLNLjZ7g/pJUIm8hr4gF6fYQHj1/T9OmB8B7YMpnXqviNgX7\nlmyhsbzOblib0ggdOJl35nYuLgG+GMmg0rou6L5Nyzx1AxqqEfBR8YZSaRUw\ncCjLuYRHhh4SmV6QUYbo+9L61GmwfQSwjs18kkOelwri3LAA3WMZPJgSOnEJ\nut4Mnrk2yK9hAecpifiuOCNRl+RxKLj82QQhQm6qtzXo/HKkN49GKkcerxzG\n6kxm+ZHHnmIaUoW7p6bAJTZ/bBxHY3J77joWS+qfxxLYOfRSTTeoC7JFgbUh\nM1WKq39nh+iCFqA5bvpHw5n1lEwK6Bn0dqIurqEko00MkN7Zz4OFWhkPxnVI\nWhK2dNuH9VnoHUyKufNSYpHhgNLAsxyvbgasfD2UpmlFNvWv8V+RKTe7Pth2\n2fG47RcYsImAftwvtknr9xtwLxRkzaNuhahRFfDn6FF5mV1PNdRR+M1J9Rtm\n5GDC\r\n=sfey\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDk3Ha2VQLr2sgj3PSVEOtVMvAtWh6on5KtO58GkRhh9gIhAJx4q79gJRu7No5EEc39Jv4LL3Q5x9KYOMIxq0geOFUC"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.23_1572697561202_0.8402425396590383"},"_hasShrinkwrap":false},"0.10.5-alpha.24":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.24","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.24+86f3e75"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"86f3e755a2f4ee4a3aaa87651bf43ebcc940dc80","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.24","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-z7jh38Hhq4dO3FO5ZAS+TLqYQp73kqhC9SG5PsVdxPidx95HtqtwIRsHCNGCPraYdd44CsBLyJCVRl4EdRab0w==","shasum":"0c0384836c02dc5f3be204e7a1ac7fda729008f7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.24.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvXdBCRA9TVsSAnZWagAAfBIQAIUlDMa/A5SRoSg9260a\nh8aNEFwgZrJItDBz3k/JPN9BXvq/DJbT5q0F7fiduVpf1ZJOeUhmjydn6gOa\ncpeuLw45lv8KKlYJgDhraNTZlz9NO+6PMO7JP3N7mBIYys57CGVjUkgqwNKw\nJK71xtoS3ytqVkrFlJ6LDrcvjsq1fl+ZIh1Rw4Ewsu2WdpPFlGaqNsN3FB4I\ngHwxEQ+0VLnku1A4Gde6TrgYhtkrRaYM57M31w5F3KR19MxEk0tLO3rGWmo6\nkILmJBJUW44bh1deFYANW0knHOJHxhWFVATma+vI451HG3cvV/vuflKb7qKS\nIgPx/n5ow8SzvmVolpWw3HNS+cTRPmq/yjwAHzoCDiux0uweIN+SYTabIF5G\nGSvKez4FgjANas8AEg2E+voNeDNGS8X34cNqsx3TJLUcAI+gS7SryGXlnDis\nikFmA3fkji+D++bS5/ExPvUaiSyi92+kXs0nNgx0zqnEyvKGIVk3Y7EsD8lF\n9017QvYzozpe1obobIqMAlumjWHuqhRhGPwZ7+e9PfcKrZxJe/pNl4o7RV8N\n9c9rJN4MF/hkxgP7fGdLzGne6Oa+Mf7imx12Gs+iLnWxRnCP3HR1tOEPE4JY\nXBQ3zSKIbGZ0CtTOjq4itQSU788ZL45Ouy3Ark7HtKIz4bv16ucckG4d+h+g\naEGB\r\n=lDZ0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDx6PFq++1/NtgNr1Mse0hMP5YzfYHicSqBSbPbuLIFLAiBn6IFU055OCJd9+DPvRDWbKpV0ep46z5lVLLaUwOFePg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.24_1572697921525_0.3110331905278656"},"_hasShrinkwrap":false},"0.10.5-alpha.25":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.25","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.25+12ecf0b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"12ecf0bc7ca3cbe009cadcf8d5ee268c7bc9d554","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.25","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GRK/1jUHVqaDRDSQRt2dKxHOgrcj4/b3HSMViw07AJG+3s2uSu4KOVkwtWkEwxIXK2lgcSfwpNC3IpkBipoqbQ==","shasum":"590f0ea8255e7c8a7bedf2113deeaf079b81205e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.25.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYCxCRA9TVsSAnZWagAAWp0P+wa0ai1YPM6ddqhsfHL5\ngnAUq0RK/NYYQXI1XrVeBV3WWQl8UDT37kJGvNhWVoEgXW4K9m0RlYSL7UFu\n9rdeetLZ86ULmQ6DHh/S+N95yuiU7h8C6uy5QDsTww5yyrnyVE0YsPvitIFq\nRsaX7w4gUSck/lvG3bdX2BfOxoWLVShui4B4Q6MvBii6FiBw0jejkR614Ulm\nKnVIXWAgMPYnEJmmPMeoRJTbBK26VVRY0H3CrgOS8IFfwfcJDYmAnS69GaVc\nB51x4pvdFE7GcKMm6vAOK60WzKDSyMsILCk49CSLN+TR/QrwPNgdXD4pPwuN\nPEiKELJl+0fowVHlJ8CKkuLZ+BBQS+lh2QtDHa71//RYUe3PfWQpa7fqg5LI\n4/D3NpU5mrLodbm4btVm1dUguBsPcG0boS704DjJYjJKqkH/F+f80C4N6xFQ\nlF6EFIh1Dk4KQ/lOXxiT0EG7fU5WLBYlNVHzCW/YgfJyjh4ZNIrcSzvUxYxK\nOF56zRESZ1gvATdIgEJX2/ii6Ykw4aQ9m0xLF45Qq+GSTE+3GLt1KdnOh5OB\nX7lqbS94TiCoYtvyrVXv5inaV7I3JIaL71Giv3wB95m6MTHeDalxvr1WNm97\n/1bWag405lhD3W+wcUMKkDZfAzSZ2pbHSzLzBb58/gaVVnkhCimr2rmWpv1T\nRYnH\r\n=xXey\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGceIrjBq/kSqa3Ce85s4VUoJIY/i8XssXeQujuWnT+wAiABP6d2TeGnsJHDKt86qPiCJQZuqen9kzWvwXQQJbd40w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.25_1572700337410_0.38346640795553455"},"_hasShrinkwrap":false},"0.10.5-alpha.26":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.26","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.26+837cfef"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"837cfefbdf82efc62d164fa61f78452c00debb90","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.26","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-99DjixK/xUVPv8B+dN26X6pcFWocdU60CQxFeabj8ArZTkdNeI6l46HWyEQqH+QDQtIRZf38JTZlNmETh/zx6g==","shasum":"fad18d06eb9ed4a4af816bc0c32f30699467324a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.26.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYIZCRA9TVsSAnZWagAAKzsQAIoc43fdUJqsrUDtWepV\nNG88rdNTCH09VKTuFJ+seGJDOkEIuDxZan3EAkbMO01ZA5o15FSneTsMnrau\n9MVLuE+nuuZjZO50OvTig7SPvj20UmkMnSwcxH20g8HhxcZANbPGPfGl5haD\noduNc38XQRtWlUK4k//HhCKTrdQ0shWJxeGI3CTz6tFKESUk1BbpxchkwuZB\nNw+HHexAyGelTUrim986fyJJoqBviofNCjppVpr1corr7RK8z+2WzRNkCssK\nzxCm+O5yci9ZpZzbezoe+zTbw5O9hEGR2wRwIxOUElWI4urPXymuD/feO5Xs\nxbS4rptzhDuSSyWw+h47Fex/din92/tOu9VL22hfzBlii6xnR/A4+69duROM\nUEX6Lqvbn7Qaqqk6G7bye6aVGpcmERpC0web3mMNB2vz6LVpdDx+m9Bl2ldr\nA+4K/6xbVbZKSGjIibx4MwgBCC5HrzwKFDTOX4XPhhdUbjqmHj+5YAN4oXt4\nrV+fZID3jU+VgyuJgUjFyBHOH5a3+ax3WxCbELF9gWrAZz2OEpKoBfJ+IQzW\n4zYqyxDOBMZ1M/lh83HTCWnh+2k9yQWxqLSURH5U/1IOGnQHSN+Svu/WdIBg\ndNClFa/FYLnlyUys0UNd/KhbRYqKtwNlwU1hrsUzU2cWn/PKK/fLnF/PXcES\n9J7e\r\n=14a0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICW1jfUBaAGFyW6CJ+9Og/dpsJm9TTdDU2fryNH2OAjRAiEAsWu0nHBcrPiMIzkE+i/A1n6o067AlqFtNBa5bWE+eAE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.26_1572700696617_0.17573531177266588"},"_hasShrinkwrap":false},"0.10.5-alpha.27":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.27","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.27+2c940fb"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2c940fb430573b37bd3e306fe8f8ecf81b0269d0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.27","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-HlFRT5CIy3z2qaHa6iKH6In7V69TJE/f8K4/pu1ve1E5csEz3YNWnQq7CVNl56xfPa/IwkrfR5vfCX85dTPV2g==","shasum":"de463cc5eadecc33ed5ed59780a9d133038a0424","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.27.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYKHCRA9TVsSAnZWagAAw+cP/2E31CObFapqK82bf11J\nPwFgiui55gyAUJYpYg2RlnsCwfpldPhg6sgqzo3TlEGt0a7MrUSf6j7TZ4P+\nZYc0si3eOu0CkuB+DZgiTJQ0pM68ynb+RHOpQ/bnKhpMTWRXMKI1H9uiA481\nXTrWVHXW46X/ClcGYZCIpHLXQSDlERHCFxK/HeOw53Y017V8S9H7XQAx5aC8\nNG2aRMMiKmvaoM/9BZPOVdPVXoqUh5nwul1nwLZJK5saQoXyANZQ88zbz0mS\nbo1ZXJdWFsAtnKK2UT+spi4ndevzvJdIkgwwpPr/0FDBZeh+qFM1bLkCbsLR\nVv8SpMiIz4bFUCAxMgsZqdQ8BDG7J8g8dQ0Zfxv6Js6kDEPHfjmG8OSqa9MD\nnvIEVUGMcarL7Mb5HwGkESTsGqkmeR5aWOU5Ygj6rwmyPfUDcvNZaGe0KOvm\nDkVIjysJHaPIG3Lp30fy4McuwWzLN4k40mbtbFSiK6EjeYeHzJjrcEA73ejs\nh+OrJWHpm+b7XUM7dlVByfFFBFIgljE/J07qqMs21oCShDnVy+28cgQZ7pn3\nDnPFJREB9xXH8ApwgTUlCzLJ5dEEmgYTA09wVifqkh+UpmLVpOJglWQBvqRf\naChX4E3jbGasx+QTvvsjxRm1ly8qnzJX4nrUzZ++NZNHhQgFE0QDQP+qNeG6\nOTEl\r\n=kAmT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHj/ZilNV74x2Jfi1y/btnJBDb9/cigSTxoba2Ka4T7AAiBRTW7BH9pEkCUqH4HRCi32R+RK0QqaiJrRFN80oyt18Q=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.27_1572700806881_0.9229389769580605"},"_hasShrinkwrap":false},"0.10.5-alpha.28":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.28","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.28+49ae53e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"49ae53e4f57fcb7837d7aabce405bc44618925d3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.28","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-XvHuWexcA4s3KDPZYpLd+0Y+pgvWTRqR6BMWwv/ej7cg2cibn74cZmwdPDF0i4uob3WhiGyT7jjXHPKr6RFJ8g==","shasum":"d9acb143751045a13c561509e9aecd1b05cdd7f2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.28.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYMACRA9TVsSAnZWagAAowEP/i43bSpoOE6Z9rKGuLoy\neIZ1pVI1DsKHz64xg4fBFTlyKKA6cCtJKs4+F7zcZFAxQqG4vHtYR0EtwnIy\ngZRgqv1vfgzS1J7hnEsEPqP1dvo2Y4fmtogkOz9yWuUXo0clzjhq1kFvEcHI\np4dd3K6wBWZxCXRLGL/BnTtzB997T2xu3Krbbs5bUqcePTu464JzN9P1lRsn\nt9tm8H5SWINmRJjnh0Hl3vCQy9w4l6NvomoBe0Qz3julzkvxqtHbpzv0x+ed\nyEN/CQRajHK+1PM++kGKarSxqTskJ3BpWmNZ6wY/4dQbf68vAukv9JWznQIA\nw8Arr4rE6f0anJ9RfTpxf5o94lByFcqGcvdeML12dGS0wRPjS8o+ikKW1Ogx\nrLBqj7JtNJDrORSd2KGejTKnC4KW5XyODMwY6RD2S+Ou5XxUU9s1a0ospMpQ\n65/NKHi4lgAq9tT420/gjrMuI5l1fcMuVwm8ATeHO36VLEPklamLPfWP4fdr\nYhSuZTq937OxLsOKRaC9UjLD+/oa+VSryqKd/Iq1JiJ4FwyK65+VQD2NiOFd\n51xhSW27eS9SxgdG60jJwYC8Bj/ThUMWxQJ+te7+RugokM2nQZC67oyBg3Ao\nbgC2FwqSp1vIkHM5xKYkj4/Ai3HiBD7ZLFb2cHo6eYlP2RF1tHQEAs60O1d1\nj8Ul\r\n=DhpL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAhAdFvadi2k2no4lSVkGVgqZDYnwfHPG075yMfW/pNYAiBZABNaP0coW452PXDXLitB9Ye84xrOvvgC125NhogmPw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.28_1572700928426_0.20424006004961837"},"_hasShrinkwrap":false},"0.10.5-alpha.29":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.29","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.29+36082b2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"36082b20665532879f182c2e433e6d7b7ce9f963","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.29","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Z14GxS5YTiFx1hph0uA1UCKxuUTZPzcRautZTNPLV8fR7XEdiVXfXNDQVOkO2Q1FhcMZJWHlZytG8y6bsrZfGA==","shasum":"267b6f774fc8eb8671353988264a2ca35990f18f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.29.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYajCRA9TVsSAnZWagAAAtoP+wS8yHlF5WxeXo+O5dJC\ndfwrpnUu/c8xF+flmBd7YY9RKkmrmxqV0dIIpntLHccrsk+wmnrXbN5zDKZr\nIq6lTXb+0Tw3QwCfu/MPShbBbrfQMLX2NLMphBxGQTJ819gi+bDcYDzMnA5W\nh895KqN9E53P+DvLHn8FqneBdXjxZRnNLYREkfTmtW7ZFvbHNna9FyG2fFh2\nBwT2rwzfrH3iLsHqvH+wHybTnw5wwLPDo3XAEaX6p8NPASEV26GeiSlnBVjK\n3HCMGLbCsss18YzCRwcb5lxRTwYrnjer610sFoZwX7XSe00iaGvh9PF/mMwo\nluNVIRc4+wBr9APpSO0HhS1bofkLDEmfrFANHnTNC+U9sPH2H6MBPgLThFRe\nGTALR94PlKFNumIpvVk8X5J1UKw9UKrmKAfu1GMdpHTC6K3pJ2XsO/LvGNVQ\nnwvN/K1grQpIxlzWi1MN9NC2X0ngq1kN3bdRKicc/RFK8DZ2mWqsFKnhdawl\n4D3yYUM2GnKdRvDmDJEMPz8/+g5JetpDe836WH+ligW/Omyj7lNPKSwHCLOf\ndi5bMm1uYkrOU8bh9mN3WrY1RCrytpGnUz11OlU4BUg9f29+w10LPuZZXGJL\ncoK0h4Qpiqi4vYZ5TvSpayUBTYtj4eS+UiRXmVT9IImLFdAPsp2M0CTOXexL\nF8TS\r\n=nYP1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDLK2POqcJNggHAH6ZvkBQChW+2iK5/V7KVVs6ZQYWFRAiEAsn7zxPoSOQxn4mVhLBKB931mpeNUipZKSmOH37gVLPk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.29_1572701858617_0.7781506562539351"},"_hasShrinkwrap":false},"0.10.5-alpha.30":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.30","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.30+3ef6c2e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3ef6c2e5535e17433d7495898de5b57e52d7efc8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.30","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-aKDNKd7gRVsjTgC3PM2AGJYyRktQWDgUP7ywuvL777sfYTLEhc9xC2SPlbNBjcxKQh07aSeSEokdFW36ajFWUA==","shasum":"c98cdb674b5de6f2d2de62a0c03ffb729e2de84f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.30.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYdqCRA9TVsSAnZWagAAtRUQAIWeUqsWk1LnJYD3sOo9\nf2SlDbhtJnI6caYfaWx3yxt1c2VkDYUau7i/Bp+WJ9f14LUCn6v+eS6Q1281\nT3ZPfbkGXB6ioPgw8fhSUEgIc95dIZu6fvs6wz1S6lPR+FF+mn8Jx4t4jBfG\nMw4Bqx4Qjgy2LAerW4/dn2gY8+pkxe1/IFEeVvwLxd1LcYRtsaUE8fWEEnJL\nySvvBWKRDL1vmU6bSa2W99x1vGNAeW7f12ZFHV1btMHwGsbpD4dKbYU9JGP3\n2YHSTGJ3CqSyTjQiDhOps2mYQ70AK6kXN8qXr6pGkZi42OmWAsAs5TpWIHnm\nwvmHRD8CkWMIGGKqTmRq2QiHbwixcQdmsFOLFXiIrw1CF4eJZVI8TAQtB3/H\nG1P86urIqGcPdQW9hAy836n5hrqoVyuXhnDUNe3qCGhOqxWySzgvrIoxl9AA\nYs/JZOTbF+PTgi/tT5+Pxj3Zh2keVOBKDfrwRgcfZ+4aDveHHtP5+/X1v84Z\nLkfrSDtf+WVh5lP3VNz8PLlCGGywn3m8WVZy7Lpugt/GfMva+39YPLOkY+lE\nggfTNWq7qRyYHDQP+RmTzhLbiCjo8MHS9kor0UeXBv8EgQnYI0qheAmojYcM\nZqr93tn39o4qwinxSW7IFbeUEAReSUglbcca/VIGXS8PGRJiBIyIRqXxcRqN\n/HuO\r\n=s/e9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDkFBo6qaksC3M1PgU0vUtLwrvbD8sxX6/QxcBytOZEcwIgARslzdzxBRr62UlO0qFJSTBIqv/xWqHtyBRIBk6WcIU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.30_1572702058069_0.19131096539912962"},"_hasShrinkwrap":false},"0.10.5-alpha.31":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.31","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.31+626b734"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"626b734a706717f7f98c71daa66f464a35d8c946","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.31","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2fH+bH/UUav6nbAc26KpyhAtq1G9xPJkcVKm6L4mC2nWTGa2l9Gb/2of+CNs6x6cyHDMUutsDSjerpIxyEmN8w==","shasum":"c7e876ff912c7835793609d74c5b9bd8e890dd17","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.31.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYf+CRA9TVsSAnZWagAAc9IP/0jhM6mOsS+Q3hSE+WQs\nQWiWQvNWgIvHsjuNaeLeUlArXLXqG7x9KlBPKcPz2X7pqnQCkilq1f0YY1SU\nTolZ+9cjWTAvFyLODOVyaD+y/KGUR6NyjrtctNUM3EbQMpESZ0fdUUpgd4A/\nfrtNAiTx1fboXvgHGVe8cthsm7E5PKhxGNNLyS69RMn+xxlgMJEsPe1seWiX\ne074gY0AX6IjaNvBceSLQc4nyWVk8S0dlDN9hM2WWvuBpLiuNqPAy7wWZsSW\noDdmVHwoEKKbRqhB4Op6w3pR+14qzCaLgmn8vf4ECeIvS6fxTgGX7h/1rJ4U\nKynVfacdXcq7B7R/4iH2JrLEZEePyE0pMAd/YcYdceu1L7QbTrx+4kA9xbMI\nKMIz9U/pIiei+PVbau2zjYsc/TVenyPu+hN4AZ0mCliP0J7dl3qZFOfaXIb/\nhHSyFoNJXdai2ZjtZeJ1ylLQNotce3wLquM6/koyrkPdf7PEo4vjtD557yGW\nmJfCiKv68Onmw6j90MStagEhomUZJiMKkzwixF4UawPOBT99qYqlvUIoFgAt\n9ZKOWQwh1cWmFYLNGssIvXlEA3UXBwMYdYulQ8NcenozZz0W0pHcAAGttDRa\nRuuiqwlpwgMMHTW4FMsLeKQJTHWyrBgsXS907Q4NGJTGqvIIrdHX8ckvGPeL\noPPt\r\n=sN5X\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICeF3pj4agsO0CUY7CC7YWXUABu/mEq2eJMpUtg2AjCKAiBbHWDHRxqQq4fXxAqoJb57s/Yf0e0NKkO+b1sMYbdvNQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.31_1572702205707_0.13650955163235912"},"_hasShrinkwrap":false},"0.10.5-alpha.32":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.32","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.32+d088e09"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d088e097be89e8d4c8b0b03d8571c53d98738e4e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.32","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0ZTWhLqGJBuMmxMZCTjisHwOt2qpkHopbZe2ZAlBaOI/GkR/MRwWVlstQ8O0fiq34mj0kvAql15KN36zQPafYw==","shasum":"23f98353e05c86c29e1e4e75cf252986720ffabc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.32.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYi9CRA9TVsSAnZWagAAKB0P/iKX4u+tHp5kXhMjNVhd\nvBd/MKwy3BIoQp9lHaKlic4096szMbEGT37FWUDxh8eJwyBM4hp/7WDi2nUU\nQ0OdoQktlvgtjJdFizvBasjw2GiakcQJkxhkATBgcMTjJ9jdRM+ngyPEMoEG\nw5EnFamRUb9wUQhFn2zc/RL9p+Fne+lNR2ffKxQ/YG+QDc+i0HbKOEEtTD7N\nx0laD3qpN+t03Qa8thOhBvIkx9AOtOzQmhCzFYfeytMzBKtlbBDwN31WfIDk\nHlHDcl+xOKzqza58QerUkFXxgGB1VHAJzKdR3SPPAdlW1zq4xGItWrsjfg3B\niXi4K0GKgKaT3tUVJp2w8JCZlCLovgXfrk90YTqBYLQU5RxYhLgLwMXCEvtz\n4RWK6vSO+rj5JeDk8OByynjGZUKmVlB65ST+6ykf97jKVjl5Tto+BNdNn3DP\nXbi5qYyrxJSqwS98TNClczYgFj4eRf+DfpagEHBMDOXjY/CZyeFRB2Oh8VP6\n5ASGrZlvFw6lvdDhyOOGqx5+4y99UZUMPiyXoVsWRpGjJTc7LTi+Uxs90mJb\nQQTPT8i8AMVBpCML9qF3qmdV1N5sJ2ex3rv1ySDbG42W360AGIC/n/EqEKXn\nVSAYKgNGW7Ok7PLqphwjYkKY5PgVAgPIyVXfHSCg7kzX7eB27Ttg5OUZrvmq\nT4jn\r\n=Mimp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDmUTOYK9iRhkoXOToX8jsL6ZcrhwKWWqNbopZ4nBlnpAIhAMqwgLR4stqieYbrk2x4G4+TW+et7FDUaowdYSwOoiJ2"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.32_1572702397222_0.755097595415253"},"_hasShrinkwrap":false},"0.10.5-alpha.33":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.33","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.33+5a4e40c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5a4e40c95c3b0c0a5e90af66444d47dc71b570ad","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.33","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-7FhVnqRZarWqNi47yeAq6KtfcR10ldOKaiiL9Lq4L6nOp9CpjpVp3CKlRF8Ud/8f2rOdiimJWRLDnZOuuBJI/A==","shasum":"84a1bd2b63d468afde1b79ec04e736a40c8ec91e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.33.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYmcCRA9TVsSAnZWagAAe1AP/AzeBin8pSr8te2DVHtW\nBTWaMOoKzMQCg67lAYG58W8jqpX8jWRx8qBFW8bYiJ5gc56S7RMaC2vdYumi\nxW+oDtcVXNslq20huE2ncV8L79F2hNqoNpzrzfrsCiV4DUenYfoUMLY3ScXL\nWym8AD6gTSjuu1gjcf0c9y+wwGhuCye+u3BEhd1ksyzHr3GgOmyye7ixwma1\n+oXYcerM/fRWhkcnt3ulPvFWvAuVZJAzTVI1GOBcrr584yG0KvLD65jtX7Nq\nFqffsS7aJ9yxIMHprZKAPMGYYcNtSLAiLzhjTFbCFOXlhKU0xoRYOmTePJ95\nnotmn9RrzvPznGuZ+XATlflXp5rveOcWu5VlusqcRew8M9L5wQQ3PMhpTi8b\nvDPkyD12Orn1n/B0cbr+EkvKYHnMpIAWJKFG73XF6GOFDsVEHAphWXufB6vw\nPmukkag1rHosSwy9ubFuxgfnIm6Qux4ghfu+z8wsDyDQdrHZBx1yAKD47u3f\nxGyR6GaJuDHkzcd1KaIktoq59srn7z/Jud2fU+412nbvofKsQGi2NV07PV4u\nGJ1SigdNEzDiu7/Us1iaYwiomgKEdLpavmlFonUQ+K8tzcIir/O/M1BdFbRZ\nWaUH7IxoB+08lHi3ySiJhUEVTI6urKoKZ0T8DMOjsfunw0jucyyIsMPk8DS+\nld2v\r\n=Tz9Q\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGPY0+h7kTaCWE/VNf1QT3P1kgZIx1YKE1Tyhu1JNRXMAiAm5eAGQZ1TeRKEMhly18Ynpscb0pN5IXwM19e2yLCznQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.33_1572702619970_0.10359041677593828"},"_hasShrinkwrap":false},"0.10.5-alpha.34":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.34","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.34+2d6ef77"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2d6ef776b24c9bd322d04fe65ee608257d4e0cb8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.34","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mDjM/GllMYa8Pjz4QgbCeinqI5epFSSJeQzpnV89yz9Q89CtVKJRNA4aRO1ZomWGDiJQlPfutbgSBw23EAjQ7A==","shasum":"da9592786c360d92c361b065bcb2687dd929eeee","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.34.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYohCRA9TVsSAnZWagAAiV4QAKLYOxNKp0sxRlB+0c3x\niEW9gfrljEp4ZdBmSb+E556eX/4v6U74LbfNzy8qAKu7d74z+J3S1LWVhge9\nI7GnuARq7Veyhvs4oHpPF9NDhhM5cMm1sNbrgkK3zqsePHB2DJQNInboc/Rd\nicJyEGqW5u++kSeFrytB7WugntC49Ub3zRxjQqPn4DCFj1JKaWzJ3XpBtGHq\nHeLQR0jkArmBYS1LSk9+AszAkSAb5a0VoPSsE1w4FyTWv/q5BUb4/VfF3CsS\nUvUqz1iKfidSCEQgse0ZFCPuaXaJ0xDA7GECv7jCVtFbf3FTle0OYsj5KEZh\ndPofche2ISXoHG5oOjpcq+9JGGLcKB7NJF/VxDCUTPRMXTaGdBtpkyGo/XOv\niurH1g0pc1AWctKH3g/rMpZfE7pk8DjZCHQmJruGN88j3Rgw59MtISLpfJia\nFKzTSz2WtyAZ49PY75RxFyAyDaIXl+fRC6laVI6R5oHCPksVzBw8b6WlNIh4\ngMABRB8/35P0FnxspQxmo7L/9c+XihpdzjE6RTNviPJrBV2rMx0WusoCL+NS\n3plwYyhxWpL12Ir7jnAPW+I4DsNsaGP7PkNPz8Kun50lCeKOB9Sgi7Me2v6L\niUFpZA+zzbJx+yEzweU5hvXWi27/flGJVkMkusK00GS3jhNErDbUXWGM4j4v\n7de2\r\n=GTp6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCnhLksWu8N/OQOrVK4tVl7TU6CTJQShA8e7mK6dpSBvgIgH+OAlllSBsiC8m7g9ogfT9MNPJwL2sNwNf4gdubROHk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.34_1572702752727_0.7056412327003772"},"_hasShrinkwrap":false},"0.10.5-alpha.35":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.35","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.35+a163208"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a16320839fc2a20aeecf1cf851d7c33aebd7b8f6","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.35","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-aHPIoQRVHtILakwOfwMoSZmQddXzUYho5ULtGU78G5zWj4YhtaRCtrNocgSpcRnBMyeR+QmeFfgimaUgysm+6w==","shasum":"ec4c39e5ede134998be0f8ebff65562a868d9305","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.35.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYvyCRA9TVsSAnZWagAAwdgP/2yVxjnj9yi+DNahTJqK\ng0exrOJdLOiDpl348ZxOcaqpUrDFeBriWwRpkJ6D6CmVV88+sxfBz4DIg2+G\nnAsq2LVozg/FPq5NmfxWcxah/USkUgCVld5rkKL/JuyT7SP431OYADBXmeMW\nxKGsv216qB7prS0L5MnjxstP8cDuuYo0fPUTXhilWLa+HfmIcRW+j+zRjZmG\ngWx8VZSp+fPhBtuq7RJP8sPkA7499eiV1n5esRpUvwsCW3yEBmXOBlq9srju\n6+3Do3imDfqAhentzjASbY1LQG+nJVqcZ8cSpvonGr++gLE4eAwZEYS6jO9c\nRyqPznujeHuAV6wmJRRi+B/bwluWHT5syCla145d+JW9VgAmY2zU9PidxVjE\nZ68dKT8EVYVTVAC099ezZ5mSBipzZk/j/sA5Zi2aAVP0NYChFhaBHZtp4XYw\nXMJiiNwkLeavnWGTmQwXkEWpq4+J1rcGVKLzx7x0zbo0vRxh20IHYeTugrlq\nMI5SuhgGaYMCe3+Btsfk3qKu0siweYpDlvvnqTCfAn0pAF5+BG1979/5rowe\n4M/JP1wF8j1CMhAe1/rUU992aavIh4mZMPtop8Yeh906TM+IgdS4AN9yoEQk\nz8QAc3+ys+ZrAKFDX5xX9X9dnkmABUtCjaKXbzelwg+DOddnMrL+jQh5Ja2n\nt9bg\r\n=uXqC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCKV5G8hCLuEjDiycjqi5caY3N3nICJAm31YUMb81eCcAIgfUNeVb+DAiWq498EFoBaaQnfcWuoPSkZZP0NhDJY2g0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.35_1572703218090_0.7108934176312902"},"_hasShrinkwrap":false},"0.10.5-alpha.36":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.36","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.36+fd4e7a0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"fd4e7a09948107c550e07d76e1b8cb8d8fad01ce","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.36","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-iQyUfIpLjz0MDFIJ/J17ClaWS/ESxo6kWWYFcTRWQvOlinee8YMip4GCzHdNpxfvpDQf3/Z2OiWi6JmAH8Hjew==","shasum":"a00f7d1fa51b7437c2b3f504765701f48352868d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.36.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYyCCRA9TVsSAnZWagAAgRQP/3AVrkyrZdXL2AANmIIz\nKH7iussbvF8vUX0Fctm7aQOjh3O1ed1nJ6KbXfo6yJrSi/L4TSEYHcWs7B3a\nOnG47aBpAdcICBlL2g37YYFAr51D3U3r0+ldvCylfPxurto3gC3LYug58NF/\nxw+o4s0HQN9g5tdUcKs1f15VymDk4cT3t7nmeVpwbBZMk9yy/TR2lDjMp/bj\n4GJ1wLpiyn6OWw63f2RzEZB98OWNZt61Zb0uBz4t4iELDfyp+VrHz1FVfZFV\nSf+ieO1CGNZthkPMaNtAPArTeepfLsR07y/Q7FrqW/nrE+scB1EXPdwz06k6\nBLEEiW/mvekI1MKx7PdvkB81VE46UkxybuNp/yYZLvU12oKbu5JC0y1TiuYn\nMC2OlZRkQ29CCHvnBH3Keey3S+kuamlHkr9ymWb1BRKJEzOoq0sXM5g06LZf\n2HFapm+e4sen6kuLvhLErktI59v4mfyTHx3ybQMagPskUTyM1nT2/4r0iXOj\nd22tv44eimHp+Ljy24+GWzfdTKPtkQB2SO3M+9K77Vi2KCVOelm9qds/g1vu\nD3b4ilhO2QcxoO7L7lUxTiljPcINA71h/RY2OuOwNRLyhAaDctWPdURo+1bw\n+HyG6lzyZn26xj8qcR689f+cNKdBL+ShoPjHgCqJsm+o7hlHEbr4Tg5P+5xs\nwCvG\r\n=23Zr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCVAEgUQagaZvNtJGh2OTZOJpp3Emv4iuCCDf23fmNRpgIhAL+rGL1kFTaPQSegAFOZIh+kXWY53oHa24R1pU+MPGk+"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.36_1572703362014_0.8093600743238147"},"_hasShrinkwrap":false},"0.10.5-alpha.37":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.37","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.37+a244092"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a2440929d0b1b61a762df6d43b25c674d18d1df1","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.37","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-E5IGf2OYU4HccSkcYoMDHRdYZ4KcBDRhdWPpJpaaPJilb4Ts7V/7wba8ZDWjmbKtqM32TpgOG62Mx0P4lwdhYQ==","shasum":"a210b7400e87a487991ade36108372a5479387f1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.37.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvYz9CRA9TVsSAnZWagAAt4MP/2Jyea0zZCJKv7c+pUEw\nWbACw+L1VH5tIM9X/89WJ+44PZC9+Fg3XOCv2KZ2essunrDKMimpBbGSlop8\nc8TrjtnnsSl4NZQQGbdD8Dbv6XeiiPjXq1wNL5BrIfL8cbZ8jpufMKEd9z95\nxod6uggwBjM7UPsWPe4N/D099QgdahwmbQBZutsUJEi9qs85Be3PQ2+Z3M6s\nAXsWI88fyAkvC+Y9ooBr/HrzauGDdgtG6qeTEkTo37PopBLkzP94fI7+ie1+\nIvrZmYTV1N8oQN0XjWqEERMdtYP+c9cWDjtdh0DBQNi9QaadURN4ilh4IbjG\nuKj1K8OYwnSSo/wRGhRjlcU1YJyGrviiVlkIuujqu5G4Pg6ezlU7sF7QYlwb\n8zuI+WSXfNSEpgCHGhYIF2UA09djVUgdFodOi1q49g+HnKdw4+2bUKzbdjBN\ntkBurxIxNc1CI4XvEbB0vIedmL871JBgNIxeeCMNIqeT8XBKUTZp9K/cwg/F\n6QP4mF/MSGUxvA1z5K50lm0oSEzPcBF87UqSWHlFEbfMoNklxZTCQc1ffRvd\nkWriHBwNPF6Ew5kqhSRJ4yAe47Kxx6tWRFn/TEEo/SfARUNvOZtDql6LzJdr\nXylAJRDkcj2Wc+K4laaALMLxe464p/V0hw24QH5cLsS0GPQ3ar01JCSqz1Q2\nVPce\r\n=29ub\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGTzSPOIistyzWp9kjRv5ALWDdbVO3XflIAnr/Syy2drAiEArx87xcx1oetuh3/TvNlMGzjrkcfgUNcNs84an23UuXQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.37_1572703485270_0.3577931605325013"},"_hasShrinkwrap":false},"0.10.5-alpha.38":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.38","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.38+8a38898"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8a388987c26742ca669d2b32d2daf9bb6ff931ef","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.38","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-M7BmIcftTBJCDXRbcK9o/H2snnwUtbzkXXkZvSejY6W/qX/ckufJwJ2YMtctAjNDsqDKPuWggwdfLySjnwBXqQ==","shasum":"7963c38b6f878ddcfe633ad19f43c86a5bedb5e0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.38.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvY8nCRA9TVsSAnZWagAAGwsP/jaqCmF8DQm+yMa3ihrp\nkTD8mQI/XPeyf9hOl8S96B6zHmtQ6RGNIlb35l+Z3HwE6HIc8f8BNt60brUJ\n9sufJAhVRb+3NrgwzZaYwwu7adJagtv68kMBmjwNUjN+bhusAfZFaYX6uP1x\n2555SwX8zya+4izYOlZa2ooeAfAC8Mw2kjKpTHt/2TN/R+JaMyT8z+9D6yzg\nz4h2UOIvW6BFAm74Zwp1CiebGYfbFHMh4zt5ZOHmGzoC94Wwp04lAcdc79F+\n0Tuh8MWKyNbN9KOsx60zNtmX8xKvJqiKRpzcTtR5z/iVtqgnuWbxBSDN1Cny\nlCj0r9j2RAyr6OU+A1/6a1nkca8gostx/MzJwOlqQy18nyhrX2r0yQxxAQE0\nXQQ4K5haAViIrD3nB7hIwmy8OcCZ8tnsUtWoN1sIF2w739G853svxxeU8QYU\nTpoE8gikCmI/vD0BL52wPZFABB1VOdGMIiVzT3obbONSeXKiEe1r7Eu+lpAI\nztFB3uvVmBxCBa+NxUMvBhKoWrMkmeUAZNacltA33v+FEp4LjLOatdD2h8fa\nqS1U1H+8E9mLsMLBnS9l4c5NYU+fADc7Vgm2vjSR+/WToR8X0BRM83hc01Qb\nI3rEujqcL+UWPPVKHJBlLgri+3ptbeiOM+b/tSKlZNpAC4YR2BBs9g+poylm\ntPol\r\n=tlCn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC9ffIrBMctqNlWBsmSMMx+CyOBHrB+whLJjDwjiou00gIgTspJH0dN/hPeOdCBK/sxUUxGp4OCPOmY6Fp/DpEWCDE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.38_1572704038542_0.6479272790689428"},"_hasShrinkwrap":false},"0.10.5-alpha.39":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.39","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.39+feefc92"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"feefc92ed4564c406fabd168e97376ad54f34c48","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.39","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-e91saU0oSqKxzanvcynbrmesQHzDZRzS5acwCRNUuUtj4X99mdpVm+PS16prVbVXZiVhrtGfN++rKZV3vn2o8w==","shasum":"3b4a2e6b13651fd32a10d6864e569373d08d06de","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.39.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvZiVCRA9TVsSAnZWagAA4JkP/31ohkA5uGhiiYFJk+eG\nJMPJyGqBZ/nrD9kca5SDcqZfJAxfI0dE1GgA+6D8md0Jn2v6hKVZwchYbvw3\nY2dWdjQviqmnNknvWUSIskn2HF+DbDNyFKholMIVrEJ9Uhnn608VSG1XNP5Z\n2Q6qRMkM3/VWTA3QoYE4YksZiCCAdB5bp2s9Z1slM8AcaMbxR/dRCnQjNanv\npYTFyr6ZkIuY35brdrutBC/jXf4pQFVfTyKcF6pBt5asCuQNxRoAisbRvSGl\nfatgz9XmXAi3iuxUl940yfnlBtm3Qu+c6bM47MCJ+HkhG1wb/RM3dho0h2HB\nx6liRA/Tf+oB3j7x0PaO085QbDCtdVZQmFcp1nZ7GtTaCgqDZTfU4uQjivE1\nB3hbvZ9CtK6FgjdfFfKNal42WrWXlXNY3rSuDcgCRIAhNYJGyyKDXlroRdxr\nwSJH3gvLcTOhfqhXf+gc8wgaIjcyvFZe5hKe+y4SzFjnP1xIpenXFOEuCW4N\np+17eMVFYQxDQ7fLltPaCI6019JApkRWdYJlM4tviD5jQgF8OOGtSmX3qAnO\nzfp6PsM4jgpWtaJvBaGlWWwBD8lFKUm32csXe/ycTlamzBmhjOf6a/z9MJ94\nqJilsKHKphMaR5n2gW5AlUrWYE2E0FvkMyvL2MHNEZTorzHL0gnZ9R9tyEH9\nTWMa\r\n=SCGQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAkNjUaHWaTLKmh5TCKzHWaTeiupanlC9boLk8Ux96/oAiAXQYR4RVqUCCUET0IA2O7SBp5q/SARc/8Xp139seH2WQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.39_1572706452976_0.28532257117832094"},"_hasShrinkwrap":false},"0.10.5-alpha.41":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.41","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.41+1ec76ec"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1ec76ec0e6e1d17ebdc90ef204f4167549e3feb7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.41","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bq2a4jj1QGzo6/xsVBoO6Ua4RclkH81Ifglf8VX/Uq3rcGWHyPaFGMOz2MSrqD9bZK/Uo0lfFRe94B1VGUCE0g==","shasum":"f94a0852257e4c5173d17a33848ddcad8605e70a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.41.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvZkJCRA9TVsSAnZWagAAWvkP/1e9ZCi1hhfZQQNFSvG5\nFxxEzF5W6E5aJXMY5bwsZRqc0hCcMsKWtwifgoVvA2iYvdSnF03KUeKTa7Ht\niXd0luJPvQb+It9xgc5IDybkvnMgg5AAJSqFLtcTHGwO1ue+RCLrespEl1Lz\nUYlX4GHhzQwuygStm9DEkmSBmUVfB4kz4ileeQxg4NoBaCtFVeBkvQXt5BWs\nDXCJvRPm7FvfRFp1AYFk7GT/FvRusG+GLxHXua6gvaRIgO636/jQoYOQcglK\nJVpgglj/oaK4vbIzidz5BEJpRrgDmB+33V3MAKL1vNCKQUftpNfej5tFehiO\nh4yAyw6IKrWsnjLfKmwKYCcPs3e3el+Z2TJr1qtnxZcv6pkVjSCoiUKEnmGL\nUzyWI6aBS8Ms+Ul2ZSAuCNHGmj+1g635XE6aqqucFvr8d5QRtBJ1DJdKecHq\nO9U0i8Vbojj7cnVWpcn5UuPMdu0sNqN/D4g5Kzlqd9e/Sl1AOEMCJzvPrFUv\n8/OJW7nXgB/T7xyMoMKz8WccuYba96TB+NXa2cRT73+5zxYSS065Wmbl6Hxb\nmskjRHSfPzV8Ibu4Ehs3Qx9TVdM4hDFX5oStWqFh56Zo3GVJFvEQwimSREdc\nushyNUhiP6xWSnZMKyLa1Q4k2bjdjpTrm+F82cCNreBJQRLRVkg8uA5lh5JS\nGHZ2\r\n=BwB3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBKYFQd1+L8toQly+Gx1KAgnPoV+37I/5RfoZ4539lCGAiEA5/Uy0wdCKY737MNywd8Wy2kBEKBt3HZad3ZpDroEKhs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.41_1572706568836_0.22743221135248648"},"_hasShrinkwrap":false},"0.10.5-alpha.43":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.43","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.43+be260e9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"be260e92d50ece39eeed6f971c75a57252739879","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.43","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-uuGIx5V7i2BhS843fpnoC/MVfMnBTopZK6kj2lZ0CSqUfKbLvKE02Lw/qeGvXX8Fcm7mjLf4eRyeoBUlNxmaFw==","shasum":"d8774e73ab8e3b980516673e1456a9c0d2fb0be1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.43.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvZtFCRA9TVsSAnZWagAA2MMP/1MfImFN3AuH3iPMZE0X\n/NRaiTegFmT0BAr1XCproPLs5/Mrlap2uHmsDg+qzvo5r9qzQR7Y58QuxwaB\n8ndkylvWLLpoGWFoHzGfypephQpxuzl87g1uOu2nckAG9mkSc1KGCUb6C6kW\nkZslKEb60z8KInBZNJTRHkVx1WZ5zq6QxHf6iIJeQytJE9u7bPO8W/tSGK/h\nfFSsf8Ua0P0fRrDQd5dp5SKtYNOTAOhX4TStAux7Ig7Dp9bTnAv3oXPeZ/Tn\ndieRs5vWrg2oAqixgjDtOSN1uwKFUsfk4Mz/a/lSUIpy5wS37lR1O9MYLdfy\nMnYsdwSpKsuKTx529fis+6wajKrz8uajqciojc75Pasm5b/0EuvEefBu0ES5\nMyQOYcMSwHrnAJyt7JNbxmsYNL9AsiFcE9jGmINShCldpDtRG+AtC16XSyKZ\ngIsEI3DDJpnK1wt6p6WuhDDDt5joCxu65fnczNgnx0cIBhHEuHeWWEWrbPBP\ncsbsyU3li5zD1z52bNc2Gj9yZoE0UItMRe/5dRncqPng+APV4jyp0p9W7Wob\nHAwPNRukboinQ54sywaNFxU3TdZ3Q/GKxdQzNP4LJHEWWtDS0ImD+nVc9vYw\nUMil85b26dFwUaV6jv02k0Y3EVyx4xXcfS0rxI3dDdxVp/QQLn9LKsv66j+e\nWsBk\r\n=XYzW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGBWmcVU11788PNlwetFiRqIbG+T/fBuCe5AL30eNv+jAiEAgmNxiHKINmpCQYt9/MIE6u7PxeunqeMQP1gZ3hGa0Ww="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.43_1572707140745_0.9611506448903777"},"_hasShrinkwrap":false},"0.10.5-alpha.44":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.44","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.44+fe3546c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"fe3546cb934f5da9d0e61fe67b59343f0cb52912","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.44","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-c/0TWuWlD0iRldnh3Y0Bcajrmx/S2dZ09Z4EU3a1ZXTBj0il1+J+/1psUl2MDXKri5+13jZuvoCiYGNba/lCnw==","shasum":"1c4899e3021466db15a1f207df49be3bec321fe6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.44.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvZy8CRA9TVsSAnZWagAAgZQQAJ+Uf6dX5flDw28M7U3O\nUXhet162jBJDOsqCnMaRnQ/gPtAJHCmXAIma7kHscL106TBP4eEvPd/mdSkA\nMNcfdYPHeGyS3K4P0gP0JBAXCHenKqXsnS9dGxEzhTiYzlKMlyVOV95WhBqI\ncjCkCl1AEvxA98NN/i4ooiw2n4e6R2SOSX8btmB9ZGkNqGDvsqaU7xx3tZg3\nZg5mc3DaaiYFb7aKg5jAdSdQSGCeBw0kvMfejXCzckI3m90FX2iYPAqMjJWM\n8hefySlPxTAK5s9/7I7LcdDu7WqEqBhUMA3K7wGo5qv7KoqMa+jHsSBgSeZS\nK0rCSB/cG16XeOToHi9prke3JT7uPOwBO0BX28LRJ93lAjT4TmHKFoEvsxh+\nGHDQK76R4+GfL8lQsvgYmQNF+6UjWGlU776cLdtavqze6+sz70kCnc+4T0GR\nlPQ5p7c7D5s21U2/wMuaCMDz8Bizdt8GSrDd7wdGYoB5/s1QIZeXdzTcsGLc\nJ1wvsqullzsN3PQZdu5TtQtP9I78nOZ7c6vkvsRnVVJo8FL2kI634rwefZgJ\nGvsu28UaeKY41KLAk/N7aP6ggrLBJPTYj40P/nqnm1LSVjnpD4kjrixI2sN7\nKVNU6sDnOFi1n9on+VGeWJu9QfvfSy6tLZM3QLY13kZUSo6eXkEgRGE0KkFS\nbtgb\r\n=00Um\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDgyyH0G5LwBwpluzFZixSwVBc0OsuZtyVM7oRExfWhigIgaQumVLHvRlvWJFaKmbQ4KyUEAdkGTWm5EObO1GWeGMM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.44_1572707515774_0.9620111534025357"},"_hasShrinkwrap":false},"0.10.5-alpha.45":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.45","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.45+a45099d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a45099de693db5833ee3d5b15c0b3c6ce9377dce","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.45","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-tEnv6fCz+B1cBfhwxBwmGr2rKqd0gGOnbi1n7WT0a5qbxWFkiAkKTwkpOGVNWnZ2Rqt3KoZ8SOxSkxngaLC4hw==","shasum":"a4791fd808ca5d639344e345c3f6f24003b643f5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.45.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvZ2hCRA9TVsSAnZWagAA1kQP+gNoOGUQD+jcviy2Rzak\nYiP+jVhm2M7c933Mz4e2q2kMIFG2u3BAsVYRYkmxA7L1y0f2eZf7vGk/u6P3\nex34Geet9/WXqIN/7ZnHVCSvronqg3QEhgqh/AnjUXXIWFU72fnLPCh1bRw0\npZ2TP8T8kZ5N11D0aYMop7WbU0CaAiD9vKrI4HQqaEIJTQdy2sElZg80HSOi\nornOOfoZiQMbJQT34hmDOLVWuglAcYCACLzFFBDFFr5nyB1O6xk61sriWnFA\nT9RLmVnHYeY2H2yF439sPkUIgPjhTnd6m3aJ56/4ILaSxNPuwgA7bmlWAgiW\n8tfq+jZeGw9AmuPRZR9li6Wtjf8AiAcR2lYA8o2V/gQqhHCJpVuEMPd48i0M\njD4pxQInWDKgq9vu5v8F8ydYdTgVxSsy6Vr+Ke9KJH3suZZqGwxKT+h3LMDt\nAi3FdDnBCzmM3kh8tX4g9IrPD2ReL1QiXQlLuhs7syq6+FJvAz726ZO3f2nh\nTdQEYiy/JcrsKfwyzW4K8XM1iPmG1MunYWgOuKswM5fFX1lWytDhHJgfLH5U\nZ9HLlN9SjXR4xsJ3uK/ijIVN9Uj5BqlsIL6918soe204pux8N3CyjgGhNJKP\nXFCl+pQ4g2/fx+5hUDEsH1Ga2iu4/1/8XtlZqc7cRyTUu6iZp50sdmirFTOc\nkKnk\r\n=wcyX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDUOPXq06MzWNsEgEgDSIlTBuEZxrxykGndT1vMTccmsgIgag+URP8+Q3DrENdS5RSB7guyrQjjZab6PpFG8FKVw8o="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.45_1572707745231_0.03726505098124777"},"_hasShrinkwrap":false},"0.10.5-alpha.46":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.46","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.46+527d87e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"527d87e1ae97ea480db3c5269fdac2a17dc420bc","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.46","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0UhV2AdHxwEi5vRLCsnU8GGdJKcW8QIKj8+IEZrKXSQJmWMrKBaGbLEEGjudQqVPu3OluSUz7gSFxmduxlxW9Q==","shasum":"5ec51c1de56788c1863170fb196c72fef26f6f1c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.46.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvZ5HCRA9TVsSAnZWagAAnmAQAJs9NZzpoKrmhrnFXK0X\n/A3hwiyVHEKZG2/OgiLprHGjhTJ6jOhbI6VTK2lXU9x2ECxYwC+GrlUYQqMK\nErAUozErszJD5uamB/jWmrPRJiNggG70rxl++FKSey2QB5n9ZokMZOKaz588\ns5tplmxs3PqCQZ8dYy0QVgI4KnApHlNULEo3FIl+0eqaOSTLvpNPy3Bo5Rxp\n/dvlQtCaOu4cRkRHOzN5IV6tCzuj+LyRznJljCws+mkZm4XpHLTfx4xuNoci\nJyiWsjs8+cMZRFSxKFRn+2ThKtHgauOKQqkV2XqmSIk31PNgYarg4KFvVcAZ\n5ejQ5XKfa+L9OdQXyn4A7kS8KRTJ9rO9DTzHuW2zJLNs7YDnVAKQwX4oeqYD\nZj/hxj+zRKPBIq5FYhyv7az+kmgJ6HDvwQ26EpKAtkPADyuCN4A9qZ7bNE+C\n6Dmbtd1WkK+gOG2OoIiaOhsWFszNw8kh9H3xkb51p3YgJh2QHzDgK0gwBmJd\nzyvJT7F1F8Dq2R7hPOpUivDnB01/SvITzAtr5nE4cmxT5GOSpgq1YWf492fa\n/KFRH8h/GmfYuw3aqwLGaubg1dCtllvqbgNLmbtZE2Ui+8zAFXz/4e+vDTh/\nliOBvSa66XDgqUyw4XrIeadwDtHYB6qlYekUWl4/bmcq3JoZUTr+J/U8FpKw\n2Qxn\r\n=ZwVJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDQDFn1jrjhlYhOMvOZPx5DtyHMpLEvxKeh1FrpHOTBuAiBT7bAY6aFcMZycvX28NOlQzsvEa361H+346hiejRqcMg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.46_1572707910734_0.221176906950177"},"_hasShrinkwrap":false},"0.10.5-alpha.47":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.47","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.47+3a6dc97"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3a6dc97ff470db13c2f66b770fff297e089ce5aa","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.47","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-+HsgOW361nLGLxnmdfNiZBJJcEjMUqU6ER8YQI2ptbUlSxsSabPflUIZchDf8Hncg6bNxzf5gJByQCrDQoY0HA==","shasum":"f264bc0ac4c895d7fe26ff866694e78169e23881","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.47.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvZ8eCRA9TVsSAnZWagAA2AIP/3xVVkDnidabyQ0HYv2e\n0Ni/9KugapuHrN0zmWrnS6J7jlvqbR5nDpJush/oVumKHSXUzCZe4mjJhgZJ\npKyyTaiJ0Xol55hIS+38PbCajQW3MXL/s9L4scVc4aNmOdMi0l3JaWYbFoly\n/05q+87jVFWELCplfxWpMZC2lnJvrOlxTjrfKQIlZ77JzaVNYvgierECSzzI\njXgv9tPfKBJx1vM5wVHlsq8Kse/3DHFAaWQLV6WUQItcNMiaoQhKaOZx09HS\nvm3RQu8BNpqQyCNN/oCKIQk1kto9wyAQZIBftrx9NggIk5yScHM6bLWZJhPi\n9Hzo57/MMrsMAVLHnhjEQeNxLu4KEVZV2cbcbaOHnZzugz5Af+KmBvzMwEKP\nYhFuwKmwU9289TQH5Jbl2sAjkaVvEcef78fSzWHL8MhB1UIf0k2tL4sfg9m2\n9nvQC4JF0sBMeeO2QEI62RHqK0cuIOzexL4GTk1Vknr76n39iF7WAabktZtr\npiRyzqoavGIL8DQM8kWiEQbhHrMUq4vvuZi/l8iCZmScFMK7xbt98wMwce+P\nL29NJvJd+aDdQtwRSOmpS9fbA0XbbSIpvTMrcRNUEnYu9JQf+XSa6XOswgFZ\nwp/n3v+UOfhtkWBH78nDUKwcYvstWpO2IX5fZ0GwKYJFaQS7F+vTrEFT4C5l\n+mjA\r\n=ESry\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDToi3Bh7WkCS+NFaJgfTi7dLslZLxrn4d7JTqsJcmsfAIgCYQ4JHCC+bfpjnVxPQoH/p7OjXToJiVVz6iZbaSyOhs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.47_1572708126032_0.5746516055156616"},"_hasShrinkwrap":false},"0.10.5-alpha.48":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.48","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.48+e929dbc"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e929dbca78c4a2b654ded05234ae3337eee9311a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.48","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/L/MHtHa70mSJyGsR1dHl4Nt1eCW05Rpx8/A4qIPbjZxceMcjq7J029v4GCH52aMHJiTUj2ObxFFmPpBsdd2RQ==","shasum":"7501293f0ac991666d3f7dd88a9c493191a6becb","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.48.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvZ+8CRA9TVsSAnZWagAAzKEP/R/Cfel5s3vRJMWMVHaU\nk+oNnnRfXzkadz2l9RicEE7F1M05av+xw5cjAe0qRz7JAMwywTM1tUSRu+vI\nZLAVkyKd/xjZ5ZGCrFXYzEpe2umUJIQ8qXKcZ5bsaeZL487HSVXR6FDRfURJ\naHnRJM5Z7cHInhP9HXl8lgwstiHozK6YpSdDfOOSXGH9gZ4KDl9d5QyUI3a5\ng4VlkqrREA/Yvdut83kIwJu47EnyxauPqImpk0g8oDCRj/Tl7XVTcT4zbZcT\nUcjsqV9LXltmSZ1jMolt59DYWoE5B8U8OTo7XEXBhxPoUC378CWcYYwVPlZu\ndUfUdcdYVKja8pFZc4EEbd+hYUjJEULyuEyszyYRUtvvhgO5ZJc65v974aag\nN9zyo+uUE9ijj+4CkILPrV+NZu6+DliTINlnq8eSMxiQUSNQxz+EHYZynOtQ\nBQM8kGLKIwjTjyiKoiIZy/xI86CJNL0ta6fP9+rrxGbjJLt1XxjlEpTThYA7\nW3WmoUOLGSJw3r5LkYNA71r5H3dg6FT21yfantUWrbMmeXYpeXNbHUtMnM53\nNMSqSgiAVIG3r6d8DVQNaB22DilY6yDdLPto6PJ7hhvXs8cGRbpRR0cefbQW\nGWx1pylZBhOypZ4Ir+WkrCOgP1xwlplxNZ6bPLgLxD2Tcn6fpUItmuxC1piX\n+Ht1\r\n=1wDw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB7SGdG0BZNrk7/VAK3ormdJqd3oJxxUofkhfdOihLX5AiEAyf2R2H62dpJpn1V1ncCYxz/DD+8wjQUobysjjdgWZq4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.48_1572708283927_0.028340452265618765"},"_hasShrinkwrap":false},"0.10.5-alpha.49":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.49","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.49+c1e4533"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c1e4533ec0c31dbfe7772f1a243f0b7bf640ff5c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.49","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-VIvjOEbuorcrJsAp6AHr35IL7AGFV9dEhBoT6TnZKuSg7W3d6uQoWb2zZyPsCVyaXOBNXFAd+CLIe41Qmlj7xg==","shasum":"b54f715968ef6c88266de1022719b9849ddd300c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.49.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaA0CRA9TVsSAnZWagAAqwcQAIQVN0YFO5KlmIrIfopx\n4oy5YZlG/8/JWreP+ubUm0fEdkwTUDePiWrV+vd1mybbCl8BcR1Vky1mOhOl\nFS1wOKTrT0g41SLOYOGSJA8Lu2kttgHahm7r1U1bLp2Tabil+eCmw5TJy8jY\nbAMOOyWWJoPXmugaWGPWfqGjdxHTV7Yj0nQ4jwrhyaHweLaZbZgmMobvjx5K\nE3qFGyyCcXefGsyzTNbG6NTFE6BAn3v7kaPq7HI6NcfqBh+LnB4sJU8rjcNb\n6tNtfYYp2yX03b6cGZqj6kYEou0fTSfh6+wOVoqJlYjxJ2QE/hNHIKlTk+Xs\nhaUQDVDjuI3+/e2IWY5gw78BHujarOfT4wPNBxMLuafCNrT9ItH+qn16/16T\nOgJTsT+vS1kWEVrjnHD3V508q6oRTOA04tHFQRXwGggXis+DRG1hXiYpycEL\ntBKSr4oUyewU71gn+BI3h4hcKGtOPGL+YVIxCTcm4XKofqf8SkIeBEf7itJ9\nUYYcvbHeMu1luVopbCMDZqwYEbqfwMtWENK1QOR6X1sS2gYGqUiX2tvJXxpT\ndovI4JOYIlwy+zPo2LPbDFW3hL3J6bNscAv8LaD5LLY2myVJzPBrhSqXSfVq\nBsZLKGRhBtSRKp6yopVYIkVuUIYTXDrN5LHHpiGoxxuWsZNI1xbZdponrju7\nijKH\r\n=Gzjv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDWLyNyRX1HBNiPuwsVO57Bn6tiVT1AaprjCYF1zSG/gwIgMJrikj5/qUboWfX7ghNgsnIDpnS8AyqQ2ohsKej2gxU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.49_1572708403714_0.3594492894782395"},"_hasShrinkwrap":false},"0.10.5-alpha.50":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.50","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.50+e5f4bec"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e5f4bec1c7cd1c1d0e0567384e8e0736afb3b7bb","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.50","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cR1ZmNIS4M1ZTtooDz1j6HZ7oVf6Mg/TlyCpjLtmbJ6IWOJDIAFtGU7nqt4nvVKz8Q60lF0aAw8qi9M3WQJ4gw==","shasum":"8b24810ab68d7b4f0c0b57e17a357581ac7c880e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.50.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaCyCRA9TVsSAnZWagAAXUoP/jnnEV2FPQwge24+Bt/w\nRyWrbOthLyXfWcmL4dRn+k61BIyE3FSFvpG3440iN2D3Bcv5xf8BicuY7HEP\nRRiP7lQzR+DvZYsiYGc3yk/HIRWzwym7sEfaR5afpO2Jk+XiCSk8GRClWvE4\nJbwblFzUS0bSVEH+AmWSm/zi2sqSujgrpb1HE3ZemufVL1l/3Ivuf2AO3tDB\n3CpdvVe3/7m3D0qj5SUcSDpC47ISYz9OwvJ3XTvDs6qU7e8nnXuOsm+zrsuP\nNQqET1Arje+OqdY/rW/f6groAjD+OtWJlOPx+BGqxb5L8jE5oXQT8oykYhv6\n0AgCHByiBxst7rEQPAzoo5f37LvosG5rfcGtMR5w3VDtn+FM11/CjbmP9rw4\n7KPWB9+z+QRiTR8BzOye+Dj365ABNwZpZ2sojLlC84p2QTOixmstyT2RBX1B\nFMhMGxOYMYOiseE0zYCIXI3Lg4Sw1lj1QDSe/Yksig4+H7ybCHydQ1bawoTE\nmae5PCawSDvCaCPN7MHcBy3vVuj28CU84MyZAIaDsF4Y0hoJ10unUdVHX1eM\ndnvVgcF/0gIx4Ioimk36EXmHbMly+ENMaIutT79jHIZXnNZkkg0l1HtFb4Ja\notRclBy+pYba1oWKmPy5HVW3eUtZd2G0eU143hrwLBkuI0Zzuz3U00Ej9kIi\nIkxc\r\n=ZZIk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCrmEnEuQpvPe3y4tw9IkpQZg0pX6uk1z5Wprj0xTJXCwIhAJppdklL2ZEtkF0fKgfSNelGiNYJWNXH26yIpvJ9nmxx"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.50_1572708529746_0.7945133059724414"},"_hasShrinkwrap":false},"0.10.5-alpha.51":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.51","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.51+6ab3de7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6ab3de7d4779b8994a6e10610e70b786effda7ca","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.51","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-fVavLk/PSkalSC0WApGBrpwChN/5cjaSZy+2eYLJCbvC7M1mk+blgWJwaibKMt2xHJ08tat2tzL2c3DyI1GTRg==","shasum":"251270dcf93713b4ff978a6dd00ca12ab46b42f8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.51.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaFXCRA9TVsSAnZWagAAfBoP+gObOEuG+E+Wxs2OHyOP\nqwAF91WyuWfm5Jw6VacfNZkaAXkO/m5+ch/fgItYGr9xaH4707cVZC4rE+AP\noCNigOWMVoHoqNYryNCva/+4mwNkZJQsY3u0pWIdjT79L4KweXz4ljBHKeBt\nGX52clXjGxciYjSUmomlhqKIathjv+hedsjX2cEtcLuMIqt57Yg3BqyqjLA+\ndGl9I86TYNK5KjYjrvyGsViQmmuKMJED0FvjPHBK13ZQtNGVjXsAGXAsUov6\nceHvUswbuAGtv/LWkU12S4AMUGmwFQ0+Xj+CcqnRWbUHv1rStPfB30Z6lFNo\nau8FedaHo9TsjAPEczpxRZsOX19v1OiCERD/O1u6b7Mk0yiiOjIxioqBbDtw\nF2yGHPdGcQDhEgs+cdZtH+kWOXJqxUHqYoJDeb5onCKESaKY82R3oDvToeoO\nhvD+Lm/3w/OQsLVN73Omrl36A38vRTo78IBzYv4XWudDeelUaigcSoZ3Y4I/\nrD8s4cOh46FSy1GEr8zDxkmyuF1kVpgkuDujTzDwXNWrxzNGkOmEfAQW0nN3\nzqtQSowK4EGX3rD/Az5bqD3ihR/kP0cYOeZ6ufSOG62CgRjkTcTTce9MxQ0x\ncWUV1D5M7t0JQiZrpjNtYWDjGD9L+6QcxOy80aBlUXOUtfPhc7LJOSKM+4y3\nI2N/\r\n=t3T5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAdI8B9drjqe7WeTOyBF6Zbij9VpMUH7lEvKzs8GTq3iAiBFkyKaZtGqvg6EWh9oGdpUDS+XnsyWhNEQOYLImBmj3A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.51_1572708695466_0.8975957088005848"},"_hasShrinkwrap":false},"0.10.5-alpha.52":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.52","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.52+587658c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"587658ca4e0ade781d10137853d7e41a6d3c3b0d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.52","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-tCoRtmxZWQdRguyQuWQ4y4xfSFPC/JeYn0sPBZJQDXlelZ4imi7gjBuJu05fyDsJfmIlSIDFXHnr9sHyVg0kFQ==","shasum":"fe4f67c7cb6388c307daa59244b2615c99c1cf60","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.52.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaIrCRA9TVsSAnZWagAAtZMP/R3+l0sbfG89wrasL/rh\numO5GHR3MvMGM/SW1l80GXnmROop6+tZ/A6d7V9yBMYT6cHPkvtVt0C6U6tJ\nu21ND7CwpoFRjhySFJdXaSmlegtazN0lykyNmVlbjdCmjCzIMf5wCqRcgtFI\nZ4QcPb+PxpQRU9PpCEN0yR7ddDetMuBGhHFITa8RlzOJmqfdnJRSivDj03bG\nObduyt1TEGzPidOGf9IbrqarBKwJ7iaEVU/CMEKo6EvQ4HjfDSBxbR4Xth3a\n/OwdNs7E/S1RDHrdvDCylIM+qFkL5/Nh0vN4M0QbDap/qrARvimtMg0pSv4r\ndhAKWEQuqQajF04okrVr6ifN4wdgp5Lf+NxKRE+Uyq6A3HoJbrbAPkowNZLr\nQtKdk1fa6DDpkXjCG4zngq339CqlmfAIPKCLyRLCfaJVn3SdokfEoJJ4KA30\nB0ae/UaSBMsCPA8pcvYrUTg1P6a76zX7rVE12Hahi+bjOUy5r553BlOV/QmJ\n3PTf8Zd+/IlXLDf9FQ9yU0h30KtgaIb/mQc7yZlC0d286yy/8iZHhqbmOyeU\nAB1KNA3bQ6nbDpqCUQi7PqTcNZdbVB9LLE4/dPUoNT+ATptMYxn0/XzeHDcd\n1W87f27Ru4TCxc1xBZIHSQJZm4kUDjFVViNG8RMKtbKHEXbEm9B8Y84gYtcV\nqtd6\r\n=ZSrR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEoXmuN6Wqk1k8JrGB8shpQ+spRE3Arcl++y4WHCEncLAiEA0PDXsqeN/J6q/yAwXVPsbKfCsQSIGqXICT/ShW5IZrc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.52_1572708906711_0.7261273226758653"},"_hasShrinkwrap":false},"0.10.5-alpha.53":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.53","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.53+9fddfdd"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9fddfdd16291c2311112bcae85ed2d55aec6d4bf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.53","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-OHAtQ/XqR/sXzzYutWbTE/c3K9e/sxR+DsL6FelqL7grI/E0Q5Vb5V+pRznvMPY8B0DU3OIsKcYVq5udehQOCw==","shasum":"0e5f01d152a60e11e5c767f5afdf4ed21eefde6b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.53.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaKhCRA9TVsSAnZWagAAZ28QAJscQo0etlQ4amtrKsbf\nykcYh1DOOVIzrmmlLp7LE8Gm2d3G0wbI5zV9FkcJ+F2TI8GrcsCZY1bADV53\nbLePpBRQFxR3/DnyyIuzHPqmSIsOAr+bZrDPD1EmNMS/F47oxoJGZoWyGhKh\nI9FCF5VbS5s5SG1ns1NPvkcDtzYvjYra8VsEq+edeINQo21oHbWfHI1wbeMz\neOb4menf3cItZ2aPsFEvLISBbQh7/02alKhdwos5fqM+WGkl2rxEX10z12tN\nh7RxFuJQz8B6JqUntOlStx0d0zCHU4MDbVT9IGpZrur3RhCZjsv/v2IYxdxu\nhsHb81o65/gilzyi+n5MqIOXWpTB7plqIGyE+uC3w0/zme6WK8Dm9i3zCtC1\nanoElUb79h7CrdXdGukoFBO3unbrFKY//MCQaV2Bl3kxgkOIdQ2JO6wgopZk\ny7qG9DzlvHUO2Tf5zPo1RzDCHqMWW2G5fVkqe1xZv2d2MfIYNay9ipHEY2mY\nYYm0xdjE2exFJrtiIkVXtPetrJKS214MfLs2IwzTOWh5zkeLtiibD4mXbSZM\n/k4O1NsqxNDcNK6kMWMZDqM7/QwbwxEYcCjvhnqg35p96kwwNknbRuRJJ0E3\na8vImkugicvtAsOTVFJjvaG+Lcfj2H+wQuQtoUZnpS+3ety2TJB/1YbsCgyJ\nKcK/\r\n=6psc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDvXmUfQvIHg2UuBbSeltFO/Fnw8ZjEuY7x4SQe0eQUHwIhAJUtSVq8BTRuprkrjkUOPaGombwHctiMLf8md71sbpUr"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.53_1572709025128_0.3684310160599611"},"_hasShrinkwrap":false},"0.10.5-alpha.54":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.54","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.54+f2a4505"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f2a4505849a6be417bcb79e38530b27d0845bde5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.54","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-vQdx07OtUlhtxTgkpuLuGa8av+GJ4CHrLXIt3tJMExYF3CeUkORTVRASGOrjemP4KbCV3H2VHz/ALknXpv8Mcw==","shasum":"32c50836a3bf9d12cce8131951ee7b3d1569cc71","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.54.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaMBCRA9TVsSAnZWagAAjtAP/1XgoE9cTYhlhHeS/MtK\nU8iEWAalvB4HtLXDBrGZTyuuXcApWWnUetPiAK01dAONQwoOcBHYuvFUwQdx\n7EaN/VLbWuWK8ct/JgN5cFfl5VYmWn3xn4CAGEnxBuHNiGCpy/Cd3/1Lhw4Y\nvS61+pjxFyP71U48lcfX+zGZfLac6tXzkeBEALSx8FThBLylCs0z5pzci+o3\njVohTfjwDWuCGLcmtfZWNQESzd8m/WHexFKGTsVBmwY3snwfNS75GYbSPVcd\n0qXltD8xIylCcUnWXZFozNWNkTwoM1CCCqvbkSpab+evCBd1TQeQ6kHZdTpE\n+WR7eeZaChOg9lVXQjctu0fW460mpRJ8VBZe+KvXDYH+20RiOEv0HSliHdFB\nvlXxPhMwy9JsKTNp1KF4nFk43Y/lRygfqHgFYgJyItKIc2XeLo39AjeF7Qc2\nOibvYMHX8S6pR9An/vcP3TMZCjN36/P5DBOsCnXl71oTgKRz+689A8ZvYKJf\nC+Hs62yuPhg+smozuCZ2/SXf+LoZz0AONoYgLErfPGjgXm8Zd1yhfA2wi6t2\nEY0ONMHOBNl9S/3tI6gmi2NvBVtFDVN0ZOZxq8MJGK86v5cHjnqs6+Co5diP\nAuGidzeQIOWQNigFtmzBPnrGDNEugcg68k9ZD1EBBQ8ZbcW700fEY0kv1CoC\nMrWS\r\n=L5Ao\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCykZHv1/mtnAsbQVN6YnWQa0IMdgUi66EB8z1/v7UyNgIhALZIsO4kFn6r2Yggx7uHyKjF7jJTboTbcCuZIG5c5ZdX"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.54_1572709121540_0.5611165017118502"},"_hasShrinkwrap":false},"0.10.5-alpha.55":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.55","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.55+3167573"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"31675738bb39c25bd5e5d986516b46847de27057","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.55","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-NUa7bGEyQcijkNZ5Vx18GvBBSilmuH4nJa1hoYbrKKK0sIjhYCCEab0FRhjAlJe9KXmAZi+fVrT/SKAfHRlJkw==","shasum":"c4a332c929a8530a2fc9d29a3a457f881990cfab","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.55.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaNbCRA9TVsSAnZWagAAoHMP/2KeEZylI9IJqCkDPXUV\nUFy2OR2dPNvmNn2xJh0g0Cg/LiPPetIhDy+07AH9cEqIY+3hnQlWlpdeqwIO\nlLS1QY8tLWBdvDQOW2Oe7h/obMXkqm04LF1wSbwzymH8d6zoa8Evr4e1Wjur\nzVa82P0umB+AlhkFdYPNooVMrvLp62/m2z/y2QvNcqYYsr2SD4FFk+4/7dJq\nV/eFf2YifIk0ciluyXf74R+TAD1+rPO3b3cggvNNeKRZrSjnmDZN2aCSaiU2\nCsf9gbRd+NsRf7KKAuzxrgXIkBhLKWFPJCZRQIX0P0DNcz0NlyNxm9A553Ac\nsuC9jX0dKAOmL4r2t5bIq/MIANu2OunTsoWYEepYf22Oz7INI8kcJLFDu54z\nPiYhrpP3vO+xTnQnlxmy3mQsUiQwq6z7U/ELZuH5tbyB7KfFKhHzU1BGeIgj\np0dsgHw61MoiuHucFhntrCnEl0us+fqqCxzv7gu0BT1YC0XxjooLmnLCeVlU\niJIVy8NkWbBQDlq9UUQXjz9rxdRaNCAiPs0W8NVdI4x2+kjcTTBEHw5pEZRZ\nslqXpsq068soQIEnJSl4H84UBuoxJo5LfkTTUkOZVtZH9RuwsUVYPeALPGsD\nhbrLtoWNlk7J5AOpW2jEF4AlCW7mMeGLaGBb0Fg6sZUWvxn4nuT2hpYWHrhU\nFEjp\r\n=zSFS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFTOJ8kbab96y2fpMEevWu6XfPBW01J/cjiNKmIKb83OAiEApNCX1Me9PRiYuyEl7wBAjWkviXpMLF6PEyI7ypcMrUk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.55_1572709211245_0.4289162774482709"},"_hasShrinkwrap":false},"0.10.5-alpha.56":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.56","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.56+5419b11"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5419b1102678f8a1fb42c5f8b90acb24888b6d0c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.56","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ES9xdmGs34q9NDlxBujAD9u26Y7tq2QBEeuy8MtFiy9PMIQW8v9bg2maFIwPmJS2DC/EMmR+Y+tdg615B9G5tg==","shasum":"22a0a9ac05ebe6ce92f0471080189aecd2cb13dc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.56.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaPDCRA9TVsSAnZWagAAM2kP/0XhX/qQM/KzKkgwfgrL\n/mmOLdFEzcF4ucMq9Z5Ar+CT0CPebTintORye3P0pgPo40QUHcrVoFjWm4vi\nD7fiUdMGAPn9L08V5EOmb3Qbxu8V8AHVTlQ6dCzjE7J+qzEwopMFecI5xuU1\n2TCq+jQTUylIvSpBLChJYmqLBGotp7h06DmUtUoV2buQs25Q/axKmP4AaNZE\nflOVXrVrqnVPcUlD9RKcd9R/pyqEolbnrjRxn+BXLWYYa00x0rnW8AekJxpp\nva9X+SFwjJh6ZXV5uKpGvKNNCE+t0SzAA6+qy/3UX5eCCfI9Lf52bqHcKYgz\njIbutCOApgWCovWAVzJDSBkrneZZCUorfws4uyBaDW4/NKkwdbj2Y4rsWaS8\nRWt4D93rvbAMAS1PAn9lCf0cu1qDGwrX450BPmQEwt1siQKVdJo9gSmF69/o\n5GoUgaIxLKTHXyLqsWflbva7ffchayu+HI4alJv6SkxB5fFAKCKqgarCzxWh\nuHzhbQ4tmh6tOm2R1DfknH+udFm2r9u/F7AxdmOjQ44dyFZAH4eEPwx1SL5D\ny43N545PtXcERE1A1jwYzLhCGUNHsEJhrzQsU8RPlG9YNH9j4FbTubwKS3xD\nu9EbnCnfgH66IiueDc7bksh1lcmr1wfi7JZuQ7y0087EOTqGpFGScbQh7GW0\nOq9M\r\n=Cwdm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF1X3yZcA7fNVGyijbCylmIUHTGRjndyxFcxlveT8N2WAiEApvGiTgRv4VH0X9vVe1oqNDcUgIoS6Z5zIVaZMv6QDT0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.56_1572709315440_0.26588775609015625"},"_hasShrinkwrap":false},"0.10.5-alpha.57":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.57","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.57+83f7d78"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"83f7d78469c471ec209cbbe02100820c4de2bc0b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.57","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-clfS62e11f/I/Xey9y13DR0A49LzbKGZlaX0uODTat/lwlTwne4oEfpE/aEglhAsnArjBox6SQ3J84u3l/GE/Q==","shasum":"af012b8c5b4298154f344322d36a7dc59f8fcd90","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.57.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaUKCRA9TVsSAnZWagAAXr4QAI5fh7uBrdVAjq6shI7F\n3gTnmEup9BE/V7foZb/2XmolGJE2++Voe7VFe34UGD33c7CKraf6trlFl7IF\nEnoAV+Rwr4XR2dOqv7NqSVfhPM18TZzZjsizJS34sGdvWZbRA9+B2Pq+BgG0\nPWSmla8dHjYJJt682XHTp5xzN04N38a3YlnPKqOhLDLZh2xXPIIHQJp0MhZ8\nWfN51GfhEraLv99Oxy15/dEQx4pL7C422FII9+zqBc5CrhNL66ffwSbOKqu5\nGsvq01N8B1lc+knEW6/MoeIoELl5a9iV2Y+8GOIIyeIS1MmaJG9NX5PD3Yqx\n4++KdhPURTwHl7PIbMsGSvc+8xhyN0TKaSpWMuuLdAYUS3saYJDeQdUcl397\nBuIiaAuED7ByzP1YNv00aA8KmE06aafSSlyKrn40851iBM6/nRIUqp6zi1fQ\n2Y+bmCzISn3Gc+tnsLsaG2cOmfXqK2CmuPcbbqnVbjoq2sdS6tOfYuMnHDOR\nZvA6UiajaQ/Vyxqdp+OCq4PBnD8Muc6t+iH6KN4Mq5noBOjzC0zheZSToB5T\nYX4j5YhqYZSOsvjcIZnpzgUitT3ZjnF+05M8xt1q8mn8JQuSDdx5EhPJlcnZ\nNaAFlnCoR+JpfNnM/0zLj5N+K2emIOgJz3F0ES2WGXGBXWdJAmCg+pslY+GP\ntvjN\r\n=ub3R\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGgabcv6Qn9VfBo6brU00xqdtVE+k7ysdujs1SRlsZJGAiB7JSfhwjRw0zNvVOj0hDVyc32keyr/QnGB90CO64qJZg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.57_1572709641870_0.6930223001170328"},"_hasShrinkwrap":false},"0.10.5-alpha.58":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.58","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.58+343ef22"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"343ef222a2e157285fd28472987c05f0905df467","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.58","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-m9LmpaOB5NPLfQFy0ClyIDu2avYDkbqyP/IeokIEvdhW6MuOXtLF39AvhFAjaLchJ7zJGzCBBkzWyvweKRvuAQ==","shasum":"8643308252a8040a9ce0606c9b7ad0baebc6dace","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.58.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaWRCRA9TVsSAnZWagAAO4gQAJAwlaIl8sba5ERBmgin\n6Dejxgba7ZVeQYHgU07anrcorzegaNjygcxQIpaS3R0ZtK9tUoHAY+G3LRQy\nF1G3UhQ2Hzuo/SR3aqKGPX0LlKryWc3q5RtXRHEsduXtwiJ860D8xfFKow9B\n330EJ3ZhCLU0cNxObSGsOC73uuxYKSvwHbVXO527S2pmhXKLkONPQ19CJ3iV\nFoYmHfUgHaWrl41g8IDqw8iG3UyVkpHuUFbV8vqnoostkOsEd7K1v+6HxzJS\nIGek4wPsCNURHWYHtUgwcWH/M7q5/zUANZGBEGp0KZNIZVRxA9EHwciKDLcH\nYe+8rlpCdtkF8OEp0kXEpHV+lLjxnlS6X0QE4MXzP2TBUptqBAKJ+WFzzcMN\nxnrZFCnszmyDfgVL2qHY9t3A38WO2Nhgrq4ybtzKllqdEEOtnSebpIvnHTFb\ng722vV1YZ25VCoTt+qA7hHJDCRZRStcpswt+XFnXC66Xo+vTF6VEZqB22wqm\nrbTqzL32EQTKzAO9H/duVDblEbRPLUGnahRNK6DXxYA9H1YBiRhN0w2NPvpk\n9OShrfKMWIa5TwSQge/q+/ZikDK2Dl64MfY+NDNDkwIg5JGtWz3QCJbeJl7y\nAg/Uso2v+04Nob3FDydhYz/8c7Mzh6hpxaE6nMDnnndKhejTKG5WjRg8IGTg\n3kDE\r\n=e7MM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCaUndXnW3ejdQccQKa1Jk1cgqHS3NTRDDIkHFoXdlATgIhAOSpJEUqleSPDIeC+797iVgyAsJWL/suN3EEicncB7OC"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.58_1572709776105_0.6072964502230964"},"_hasShrinkwrap":false},"0.10.5-alpha.59":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.59","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.59+651dade"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"651dadec17b1a70a6c37a3f67697dc492df83f8f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.59","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-BrnAi5DOo1SRWsy5RmtmFhVc2zFRBvdrYocgC9rgtXD5NSiqGAhoRTAKl3oRtdsNo4QjiIrU0NWexgtG6Jk2TA==","shasum":"1a5b8e64661c782a1b93181fe2bf650fa7e1981a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.59.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaY1CRA9TVsSAnZWagAAkLkQAIOvSU5UUGCtvzwRAE5V\nnh6OHbtUP8pMknsxkEvDhRzOuKWxr7yVyFQRHARmJpGODtbRpUuJAxVR5Vmt\ncJmT8KHEw8UJMBvhLE1LH4fR5U+H4h/kJppTzt3HgR6WneRS7jRrtYQD63KX\n2WkkY7FhkYiGyzS9gPGcVws6lJzbcLnPiqDYPxrrFecx5505EdngM70pJHD8\nOY/WAFeOssiI3EfhfdQqh6MFH801z/l4jcbxhOH+I2Icj10Jb9boGDD14rUJ\nDrhRKrHXJuz3J4rCWKs8HbpGfj4lR/KgqytJdgP8QzFv4nJToGV2NRpWRGJv\nRRgtpOTp37/KlOciFmC2igDGjr7QJ8hrNCCEyNjmazvhPwX7cgSUawuax99g\n1K9CRTAUpPy7fb/1C8k2TG1kr7dBuNJofESlM/v1sz7TjLtvVB8WykRaegz0\neIKc/r1POPQUP8rAzqK4KJVVQTQqxWgKjNKWxF2f0RbrOWjXP/f68EYKWvlI\nyBehe5lf6aHTx4SDpBohGwR8/SdnfX73jP7TJuaguPcXZJUVPxeP4fUHPaLI\nSyiAMy5X0Jv+yVorRpCDaBwDNMhzWzhrJHx/0IuXi8f5PuOga2FZLX3iLImv\n0jogCX6d9kZjnzzkQSAug09AG7i0FP8uZQKxzQqczvmL2akP/DaiGBxjz8+L\nC4x5\r\n=V3ak\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFr4430+KDltPSgYOcUXjV9VWNpnskOUcJuGeXt6F++IAiEAlYAwcWZGV/iSR7ITYs/qhHkRXHXUuPEBABSuKXs7UrI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.59_1572709940713_0.597722539803544"},"_hasShrinkwrap":false},"0.10.5-alpha.60":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.60","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.60+be4995e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"be4995eed735db315f670c9bfab83f4d022ef466","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.60","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-L75AyeHW7C+/CXiYG9I4V++n7/rd9d0FsSXBiMfY1vZuVB5K8DVbNE7B2D4uJ6rNltnVeFpD9vKAEMs6d8AGIQ==","shasum":"fb6c6917fc69bef275338614266dfb2e691aa2e8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.60.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvadiCRA9TVsSAnZWagAAqSAP+wfu6XqJmRBxi/y+ZB6q\nCdP+L/WUL/eHt3qeZyoJnQ+OdXZR9z+JfSeTrEhHCOkjwdM+8Gbk0L9MTuiJ\nEX5mYrWvIx+RC0jONAiNpF7DvjhspOmp047pjhOBMt8BdI0qnhZReXzN2TpO\n2cypwP1XCtAd9EKuwGhpHb/8t+xOsZP4oerIFI//psg6fPPrhuHXvWvTfgSI\nvoW7SNM2+0rUE42pUvAzzRa2UNf5J8Rza8jWPhTeu2uqT5XEkmaAmIqMbqAT\nnmCE9/q8SYCkebksbjHejJuO8/MiXGu4Nsaull2hipL4/RZQm1oBz5RMZprG\nmojjmXZ4+F+j3BJY3xYbsgm7OWReKA7ZCl5sbYRNJzIDg2FDoIefyASRHHy9\nSWx0uBngjZUJWjb1h+PF8LCH8eWedMGOX/20gblY5RkbNJDLZwZLzHc/Rqe1\nwn8aOZX1Y+RWxGtBA0m07QXsg7imwQ1kk3oGN5IWiucVV8BZksq8TdQOaO/X\nqOLxqVtYhHGLc5lm+eHzzGcwZYxmtqXppjlCN1jCM+uWWyTq9udkZe+mFqqE\nWdQG3ZOqtDfLWjdILoAdaGkzbmrfoz06wFvpRUONSBH5OTSm/JTpm9+eETBn\n9g9Wtb/NuRs1PaEfLXHNTgY4UMbwFZn9MX7n5+GRhWfDo9cHhXR2vwJ7wufv\n9vKA\r\n=gSGj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD+qtKrcAFql7RzppGlgYp1StXUe43ARydaHbZ0EYaVjQIgK/yD06MjwsT0Q4Oo1AxAw6HBIHv6bUbWo1jo0LhzkG8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.60_1572710241774_0.7670698026191074"},"_hasShrinkwrap":false},"0.10.5-alpha.61":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.61","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.61+210f1f0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"210f1f09195591ff5ad5b4e6072767ac945a73d9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.61","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mu8uVxM29ocwat24sCpHP2M5Rx0xFUx7U/RMmX8apigUg8SXcgxxxPn33nqR91AltHp3XNOzIyNo4aWoCmeoHg==","shasum":"531669e06c4e625520962cab243ff1037b1985f7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.61.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvaykCRA9TVsSAnZWagAA9xQP/2oNGBHsdxVAQ+IX1JIP\n1G5zzC19WtFAzEnQgOBQ+1o4Gyx96nlrYLetVKIrFI383mWKGauY7vQGazSf\nYMvNXpyMMeNhRnlYOlu1JonkKQM8UEAGNsso7gFPVnoJkBs//gy8m2lYNi4V\nVTgLTPv/zKeFMDr9KLFKl/PUCObCn6+nJwR7vcaBohrsEen9HaoAgugxk+wm\nZWcnh+EtaMa9uYvyGETF4z6SUCXm2sqrGRqaLxjclqHu/GiQK0HwIcO6WvhG\n5mFahv86HQVOwGIl4FdvYvXeSede0kunA+xSVJ1tbYGQLCo+fm0mniX0dzX0\nEpZv3qHtnBxLDIekjzbm03/H7uH1cdMjHNzCWmYAYdpvPXDto64mjqRy9dji\nyDZt3Jbp6xTwn38ux9c/WUVBPKdRLwplFCjSbARyt7XeMlI5da55EaUnbHQk\nHK123mYzYvwZptolJyZhno4EMfDqVhw9ZC4BG9cBL7zhTdjvjVwZ5c0nfs6v\nHUM/xL1ibLuoKcUwqwkGNFa/gRwD4eRW1OoOv3RnSu8TFojDW1ZXq4xTZEUl\nt6YU85nXeCRdpzlbi08CwXdUGcVXjNNbAVVqQE0beMvVZeG7vkUd4eNOnVFM\nt99ozBHiQ1LkkI1MBm3bPLRL8WS80m8DbWybvnP27p6aUwn+7MOJT1Jr6/ad\nokEQ\r\n=95sV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCvTzAwDCHjWfHL17uDyAxPm87L3FdWxQ74FruWFqukkwIgJgj4JgQYrZwXv/8nQnOD/D2Qe76SImJnAVwbogYVG+k="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.61_1572711588222_0.587196163574226"},"_hasShrinkwrap":false},"0.10.5-alpha.62":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.62","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.62+f2224f5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f2224f5293161be8a862907557046b09d6dfde1f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.62","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Khq26rMjXkvF9Dd0LMkC0h3gXyM8RpOLh8hPmcH8lq20/WObe34nXcFhAkQfsRNIQjXTab1jgJh2YjGluL0zYQ==","shasum":"dae583fe506902639cebe06dcbe1371ccbf4a22c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.62.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdva0jCRA9TVsSAnZWagAAYfsQAJFvcwZwzmg3PHtV85O+\nL+SsHEVKpMjkIn36i9wcguOtQSDCnfKfTp9eULo7uh6cUUFQuqByyntYK93X\nMfE6BPCXB5Dwrw3KGQbGJuJDbzywL+RIlRdCenZuZwt5z5KZItHLua2AArze\nTXfbFsKTs0OWzilTJPUVCptGLKZZeGM9dWkrQzPK05vq2H+2tgG7dosoEov9\nEkOq9XS9Fgrp9pEYyGfp0eOn7o4/Bea3KKBCXmjqCYLmyZnIqxZhLiQA5Lc2\nNXOYxGX6a+DFYngkTlGmAZnI0lsRGSS1DYD4btsJpVPzJrNASyNB5yfb9mym\nMRKQwxbihGZRzn2aTzjzM1H086qiQYw0s2o+eX4ei1ZZfdN8CQyTWJXpOjMO\nl8MUMMUMqTX2YLNDTSBc9S5c2v6kNPSyQufvOa4al5egfkiZ5GrOOFp8uafq\nXgzh57WYfA43eol2MVq0A1G8nZHEvDAre3OM7pDyA9LVKq/JrfjEnBKjwDG6\nv+oMox7A5Jsn0BOY3WA/0le8/Niuwio7ZsLmmSo2zJT2vZrlutk6m+mutIbt\n0u8+PgBoLUSVOuf0ONRFYKkme9Cl1T/YKD9Abd7cdJz9n/twooqukxPKNy9p\n6MYlCCBc+5aFSjOBQJVzZKshpb+UjzMBLFRn3FYdpYaJK6xE/kWFsG+UYss5\nYz6C\r\n=Njfc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFqXUATNKiQ70GFCZ72eTurp1QbQGkezgsVPFz1Af6c1AiALXBO+eKUrJBGq7lHmOv+XiYvh9EtPiRgihNe0Dsh76w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.62_1572711714679_0.6462096025048967"},"_hasShrinkwrap":false},"0.10.5-alpha.63":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.63","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.63+ed7fe77"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ed7fe77426f93a8066b2f0812046d539a97ccbc1","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.63","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Wvn08KmF9PxkMPGKdA1v4+U3SSq5X/yOUlMf6I+gAsPrSWbfFlhC+SU6GUJK+VWTkQohn4NeFZvcUuMqE2SKSA==","shasum":"61c47e2cc16de17652495e45d9349e067a14483e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.63.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdva5ECRA9TVsSAnZWagAA21kP/AuGA8YE/edoIsxlLZrf\n8FxcDdvTJDApcr/psANQ867LxMwI+S9+fmZVbZHLcikH5l5DD+oHMB3prK4+\nLG/y7ZO6o0THe8lWFmRime8giypBnQ2K3U7IeOmaMhIdMzNL5HW2cb/8w9Rw\npwODZE37l9Q+Sjb+9cIgLhWHNkrjEyLP1hmepvTSnckim42YqPi8ILoDkYYr\n1gQsjgPWCrecsZI1w6eLcQTlsu+NsteCTpfOFW6gi4RNraNuV/CNrZwyuq6h\nhc5HW8KtyvazPk2QRZtwthItZ+gh08YFzPwdVP1beUTtEZRbXXc4DDHx0xjo\nLCaVCBhKnyurLA29TAQ7cU02x7OiukOUXuYJgW75E6B7ddhOdBR/8Is8vJpN\nhgz/RPsi4LonMsR1TbzSZ9xJ0WTpUrXO+DgcJPnjfXEIwtDdv6X+6W5zyhH5\njQ98c7asYFSRXc92F38wnkcfmHMaVMpRYgpoeI5kRO1fuMs1f/3uVKEYJWG4\nSp/yy8IXeW5NQwBrDHxQWmHehvPGRctqlEtiEK/5yqCXWkK5ZraL8Z+zdN4E\n5u1xuFYGBlqQByLIGRzckohLP/lg2j/cNpOm0sjgctBZgV/EdaS1+OR+86zd\njb8vKuMJrxSBjOrTvTDIjmxdQwh8ryIdMbzdW2jyLppDd9aWY+Gu9lRaWIrX\nvFUw\r\n=Zsye\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCjTr8Tre6QXQ4T0JdVoxVCA7mVCaoP4Hlqi7a+G1F5UQIgPumoAK7AkfGOtfKNer53jCuPzLSV8i6I6fIgqtd+JPc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.63_1572712003769_0.6162250730069119"},"_hasShrinkwrap":false},"0.10.5-alpha.64":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.64","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.64+ffc6523"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ffc6523cdba9dbcff2d50b5a0c3b4799d1397d8a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.64","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-9OfARTmgzk76p2KsnaGOWFUlagbVdw0e69bAPZl1dERxciDgh4CcxnU0P6cSKT+O78OTqZd3DnDckgpRtJTtGg==","shasum":"8c3eb4e234c40b21ef89ed7cf0b6c60f727e3b3b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.64.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdva8KCRA9TVsSAnZWagAAnbkP/1UdMPVjtULIq/gFkAaD\nbVwCOvOcrUKFZmEtdD2DZSj3h3L3y096c6dpZuHlRKbug89rKp7rPhpSd1yK\nevQyOSkb8H/rx/tD1MYFw8iDLHXgidxhZ+naDUGM8nEWJk9QaZyqxe8p5BNw\n3KZZIQ8EUDcz/TxIUDDWOlCvWO5warRUX7tzGcIy08seVl7ZUCIggn3KE4GQ\nT7aeb1PA/oY1lh5ID1muWU6Oucy2Te9Ys71oIr/KMghuWkwK+bpy1ARHTrVt\nJXt/4Bl/FxLQZkbYi5TlXCZo5nDAk2KJQffRljfHHzBFkKukhlHh1aQhkfpp\n/BChD1OZA16K9ElyxXzxIGesPBDVwiypuQnOFES/OQMB+2mbb35vlOhKtKaQ\nXgeBYWQKtKyJCNEW0ZHFutS2IzgHr+Ge00jX6scR/JH/t+uFCWZhwKkK7sxx\nljjLHGN16oUKXYM+CRKPcSPkiI3AwT+JGAjA7A4+mrUKzqIZE0Ph3JLptg86\n0NlHXKeuPzxhDKRor51+iFWChaARHi437j1tvOwX2FHasSb6NMm4YlReXNcf\nsgPZD1EhbzRvxmB1Ul5I4eqMSK6WHyjOdgj7kuVSgcr6NwXNhNb0dYvAeb94\nuAdgKj5D8Bx+8c6QhfLVS/XBIBfatbdievHPOEfiqW9kNKBo+KR5gv4NucO+\neHog\r\n=eEBB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCjx06SulOOCw1Y4wet/Y+nvyv0+P8YxfJL63C8EOSlPwIhAPneJm13faF/+ALN5DL6rhMM6KqR606Gl6E1Z3N9fZb2"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.64_1572712202212_0.3739271708185119"},"_hasShrinkwrap":false},"0.10.5-alpha.65":{"name":"@react-ssr/nestjs-express","version":"0.10.5-alpha.65","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5-alpha.65+26b7bb7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"26b7bb7d3994001ccaeca515e747147b74e07944","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.5-alpha.65","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-BGmfy5pUsfuTFHCvtX57xuIg6Ru59NKt6hr5dUtHkXuO7l7EW+sL6IQCFuEcUak4Dr97BEW3vuYxqXVh1EKrZQ==","shasum":"2903d40edbacfbb9f0731a84830bd0115aef3253","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5-alpha.65.tgz","fileCount":8,"unpackedSize":13903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvbERCRA9TVsSAnZWagAAPGwP/2JmbZhU8KseLSjqcCF+\n2S1qQKtu7Tf42FqRT2PT9VuLULboI3s46psIBscfJmX3agOR0t3rEKSqZt2Z\nvMLNHlFTyoRqVahyHxM9F+0r+n6MfyHzES8XVER+bAddxfurr1NQzt0O1sN0\nSDf3DIAEwUUzXZfUu8JCLfCd+N9OxWcondQWHklOFMB4BiRbgXK+/kj2H1bO\n6rO1x9xi0k04QDesQu7hgK66ATmk4odoofNCIhu/szqn+XCHJTgjT9qUSeU4\ngl20ezThzAM4+5egT7M3q8Mjlmqki0dDWHEG+P8osJDNpFOnFZqHz5y/tra9\n6KKotPaQf9PMdEq+DP7EQq+aYJZBlZWR1RLbnz1+wkRZ7gdCpla9n5+M4SV5\nAxDM0p0b/dDjPyNTznhll1IG2eeaNOrILEpydPZ7SfUHZvDI5naKE1iqiaew\nZ10An99mPymMcziPG/Z7nGlO8SHPJpFQQ9dEMZOFnlFJQB9aqMM25i+8Lcra\nKKNDnA774p7SP9pHcjkFBQVh5dPcJgBzXj2wg9yd/pSUP1pF1b4uADonekMw\n49sHqnKe/7raKLTUBxE+IAYq29KEwSbY3dB1yKEBaDFTbQAYviBxzptKu0k9\nG4/t9Aj+dxyYUk6Oc+7QIH3P8WbGjyXF6DFtiL4di8KrWO8f41FiI8a4GfHX\n9bWE\r\n=Mp+L\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB9RlFdjwM6/mfok9VKYHZ/8h8bF88EOpCSbztIYzFUBAiEApbHeMa4qun1PqmfLbo/fA27ZMurrY8omhCw7Mj0Fc+E="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5-alpha.65_1572712721377_0.708105285691045"},"_hasShrinkwrap":false},"0.10.5":{"name":"@react-ssr/nestjs-express","version":"0.10.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c3ba91abb626e9abf60477fa6046691076956d32","_id":"@react-ssr/nestjs-express@0.10.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-U2wmGXG8eXR/JH1MHloZZoVOdCBz6oWe+yJQhPJS0DcaI4Qx0i7OdZlX4bc7lONEb+93BDKKkAScrrIXYEGhSA==","shasum":"6846dfc31a3554b1149aef25250ad6c253e6758f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.5.tgz","fileCount":8,"unpackedSize":13869,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdvbHXCRA9TVsSAnZWagAAfdcP+gK5p3LUZSpKTEtMBgdP\nJd97GnvwZ8dRM6G7yuL+YIl1VLFtrVIuiwekp69XzBSH5xMBLlATU3Nk5oH0\nrQrzAFkk9Yna+y8219znAyNsuesVkCpMGMz62N1klolsd+gAQ2UpxOrjT+dd\nq2zKStjC7yraThd8AT641Z/brvC+bAgoVlsHPE7nVwikmPEnFwA8Ywjdj7iL\nCtQEJubzOWTKP+oRYpjgKVRzTLBZTwGMUqDjX/0RoX/Xt91wLkjK8EvKQ6Cd\n1cY2V5GnxfhtAI2S4vgou4lLWF1UbgCkiqWgl1sfHaR86d78BuUqY2PVsMy4\n68zlNsmYZ6hRtAU1WydE89ao1TXwW2zSvEQCaZunIfvtOFzpysBWnucSGKCB\nMbRGcmXK6YmXthU0FY67Ez5oUTH0GcwsBpYJDwI7FTS1jhsVfnkmB+JE5DBH\n3+JCN5abZMLZuS3/8DBHiu88uZGY/EUtXYf33d1HkI30xjRPp/t1NHEOtvHb\nsfBBB0O97/AGU3iyL6Whzou/kB1953Q+9nxYWhI0vjrb+a0G8LZCAtdd2UZZ\nVXHo9kMU4lJ1BI/0nxCxI0VnfvCqlH4xjkqelwkar3O6FBP6pa6C0wFCWhcw\nN2+lXjj+1dqIZgbs84sZqU4lKdAyezOzEL9dzQmlEmw56uy8XaBXe/8vP4pZ\nayNW\r\n=9yG8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDMo0EqUHatl0yntpkeU9v4W15pRpDZGC3sfkl68i4JiAIgMtjWHwpzi1ahERGD18J5Tp30QyC61amR161EiLlC+To="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.5_1572712919171_0.26689695047385276"},"_hasShrinkwrap":false},"0.10.6-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.10.6-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.6-alpha.1+ecde816"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ecde816a127cee1387473919666fc368bce5646d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.6-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-vTRa4fSqRAKF/yiKT8KqUT6Jj2kSiPXqhZPiA6HuIWRZ3vglu7HliyIXL5HAhF80F/9oj/7lYJAgKL5p4VQN5w==","shasum":"cd8281a8ae784849bd67a194a32453877ec4926a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.6-alpha.1.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdwTsyCRA9TVsSAnZWagAAjucP/iGgIlNlHRB5iFMrFfdo\ncS01U1TJ3D073ZQoI8t6LpHMXn3juVgFzf6dIHICITav8IaNmXMHpeWpUG4G\ndX1+wlYACCywR5/btNDtBwXgPAMFm5VyhC8hvO+MaAfDprHCE6EeEFaRZez+\nHVzvRzdTegDL2nR0TGNFR5RAOmrw/Ud+HNzCSU5FNXtBoXzLAwZCfMnRHWDr\nVbn0unoNQ24Dd/YL2mPqad+A4NF8sy5mHOHa+MrNGg7lisVHuOXn8PkLefIs\n4+it0mSrKOygGAeLXOWv58AwphF466vJz9pq0KDY10jCPjx+c2iR3tuRPNVn\n08OVsufS/zCmrBq+0SWgKSDLmdBRE52LSisG6Ulu5avkKm6CudXnqCRK1azA\n4izwE5XCU5+yruuR+y6Qd7/HhBxOxgMJDjkybFwMjSI7b+5LEq4OXv/X7MpN\nTJNsTV031UEf/Y3KIH5n89aZIM0e+zasFCDZ88TCUQqffjpQc/tjH+sdfT69\nsy5MXJDquggeaYKfaT6QkncD+pTuQbOOPslWwzkJGAVZ8wbWI73qNWQQte7P\nIESg6+HaFYD7DXNma/b0O22DxMdoTB4AjKW4dfcyqPL3jv0EboCuRO7j+NBc\nfztqX/8o6PFWf30Bhd+zsjd1IzPKNtsNBLmCWBRpIdmOXr2Q/VHfov+XnhQ9\nckto\r\n=NUeu\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDNNl009rW7pxQhMWk2AqvSkp1hDuWsaRuFuS1QclTP+wIgSi8eFpmKYdpAZsMaghcioAZP8U3DIpOA2RG8rl3V5nE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.6-alpha.1_1572944689752_0.8619597996702053"},"_hasShrinkwrap":false},"0.10.6-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.10.6-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.6-alpha.2+50fd939"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"50fd9395236d1910a843733d88d7460e52a1d684","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.6-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ngWFGVcXm6STPdYVI4SJZY1f37Nyvs0PoomeV0qoQviR8FiKlpIc4f1gTlEjg9wb4OSOUL1EgNMt+iAuTQ33ow==","shasum":"3ab59181f981ca08442928d8e2a567a12c782cdd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.6-alpha.2.tgz","fileCount":8,"unpackedSize":13901,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdwTwyCRA9TVsSAnZWagAAWWsP/0Cqsl9cu5O6gmxRd6fp\nKORgO0fJh7fCjZVsJptjxEwF6U1D8Tnolmr2tBbTP/FkY2aqfMBx86zqznc9\n6fA0ardA9M2DRlvbZOrIpgecg/e8qvxMDCtdC84bA0uVxBQxB1JsKRQhcIEr\nTlHkSFvnSgd2zWvrW3KoKWae1NCwpalNKkqsw/0E0u5eeuVxdVhe0HvZne6c\nkGQ10erRY2YFHvvVOU33a2jFMFLDJNmlGO0+WFwnNxsnFTFG9U4HEqfvng/k\nOB+FccYDo/Awu9rIBDbCj2C9Im5OBe4XRynU7D2Squ2LJqKQvrYE3hH8lJ8F\nuEDgXijErEWGQN4C5DPpefogeDHSEZC9VTjG1BMKhB1H9dH8pJoz4pFriYKD\nq1lMlLn8IRHa3gB/zabcoiRlVpLPZIwnr4KfyW4YM5vtuvIqjixytXjE+Tr9\n8Pc6J3OATzY1g34RAf14kZYouN9ouUX1xY7aF+ndX9fVmQhW4JpXC9g6r/Du\nE7tJRTMyqxjtf1oQsFGAlbOm6QL3F0b6h8nosUXg5DWLt6gefs2/FPnMNkD6\n+mYRFCai+CV/DnAKSwug874zoMfZbNk2EejitTNvLK2/CZ5T4s1SuIEsZD1F\n0ryo/98a+Fo2C1GbrWhcBSLRDHuttutKWOSehIipVdWmTyQKYZ5R+zxslARK\nEByX\r\n=nF3W\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFj/q/nRuOQfEekilmEmWpdMsuNBwkWAqnKEHphUQgPjAiEA9hTgMSgYbF9rawkpkgXLa0+e2DhUoFplaKkrvRyjMow="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.6-alpha.2_1572944945748_0.2405520573265214"},"_hasShrinkwrap":false},"0.10.6-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.10.6-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.6-alpha.4+0706214"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0706214fa00fe92ff9e092cf46a15b17f992a7cc","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Rules\n\n- The each view must be a single entry point\n  - Don't create other components in the views directory\n- The each view's extension must be `.tsx`\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder is ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these dependencies:\n\n- `babel-plugin-emotion` (devDependencies)\n- `emotion` (dependencies)\n- `emotion-server` (dependencies)\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.6-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-hNS8pTkstOgekmD9aOdI8BDbNUezcwC8So9fXqfvt2o2i/6DXFDDUs8fO7uiVaXDIwaatPsfpFH8PfcnZs3WrA==","shasum":"b526f94d1711443a2fdcd5837978748433d6cd7e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.6-alpha.4.tgz","fileCount":8,"unpackedSize":13895,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdwT3DCRA9TVsSAnZWagAAFp8P+gI8fQkhfTAf9LdsX4QD\nwXItxwsb92HLv8L7M/waf2cTSmHvuCQsdQlXYgDV8DGKtn3mz44A11gsFz4J\nJEPL6EMRwqTHZE3BgwLvAjw0e6OutBGKnYJJ21LZgAEANGImwX1d1tftpbGG\nRSzms5lxWZ/9ih0ZRZVdZ4ASAhGWn/DV4crfLBmy7f5RW18A5eJ3sYncTCNG\n2SVk3rABeV7SYyL0hri94Wj/qf2sTar/tON+Z0c9G5IY17I5spUfbRxtrkke\nkwjMluROJy2ixca3LvIgpd0x+K5S9MK5zrZ37qBW0HNdeCZiY6tGXa3X7HZ1\n+3DD3v93tM6ZlsbFnjFFj9NyH56+sh8dJvA2IHEvDvpDkyzu1rDKWwMlYmXe\nyPzs/mMGr1CoZyO/BDgroyRf7J8yhkVu02bb29pTiumsmA9f9T/ZC9stoQWC\njYkXMYQeJ9hFuu/5jFxj+A7nwuOP6wG5f2gTrouEbGmuWpO5RcHNKIWrMZjK\nCnS+sNE/6s/G9AgelSJWMGzA+PAEAsAX/OgX0yaRJkuS5jgiftvr62Z0iw6d\ndBW9Q372I9yPGqDBYsthOCcs+5kQM7gJLxwbJvBM7l799UAhQ3piL5X9yrHt\nb38irUeTOYarpazLG3SlMo0yH7nMOpRfI6RB69Yj4ds19PgCzYKq0BXaOMte\nnvee\r\n=3bc2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDuaHqUCmgGqdABm/GthVuTGg9Hk7kNYqg5lLkxo63+1QIgcAa777cYDek687Du+PAhN2lGxZlc8Jv1CgguNWWf4wg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.6-alpha.4_1572945347520_0.17677599988158033"},"_hasShrinkwrap":false},"0.10.6":{"name":"@react-ssr/nestjs-express","version":"0.10.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7e4ed73fed22eebf2fce25cb3f91f5d3658c8c62","_id":"@react-ssr/nestjs-express@0.10.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-EDZGQ4pYIuewJ/crXtvU/r3fNGp4igM/MYB4k7Abhn69YyNMTdyujiO3qoK9UlwHpPPTx5rUzepwt1Psx3q37Q==","shasum":"2f16600cfedf7127e0543211719f9dc86e21a213","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.6.tgz","fileCount":8,"unpackedSize":13863,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdwUOtCRA9TVsSAnZWagAAawsP/j06qIC5ud8fBsDwa8j0\n5igdhjEgnvWageMttIAHKOeKj2KDel3Oq8w4DqXe/iScf9g+iKeCKjbpf1gp\nueZmGzQ1XO2GpHWLbe5FNI2n3nAdPcADZROdoUKlBSHVy7w/bhPNFEE3AVzc\nSQO3ElsbYTXDlTR7lumJgxhrFJ8G3Y6CeTM0kx2k2iyOZ0NP8hIzjBysd/rx\nJmn8oAPDpmq3jK0CsAO0sei29140gAlXisqa5XJbHvi+DPISUooFeO7lX3JL\n7/HuVADv22oKQkRgjCuM9XqyN4Hvc7eYxLByTkUdledxT/6LlAM2epV3IqgB\nX1PHwq4tEGhyeCwHR0PhnboL+95736ERi/X2WvO22n8Q6ux/bFazj5O5ybsC\nVSZm6OUYX8OjBx+V5famC3+/nbKOazqYhwxKJgVKTGhkXVB3dETJsIZJFcUz\nkAzAiMvMFMIcQI4MDHs0AQXpvAIZ2U2iQARLX7ea4GUdWq2rsslEQs/xKo0v\njgPFQvzOJPo4r9O2DNg4LhLsNMfqyWHdEv/UkuYnofZGZav7DciUXiiJsX1D\noCNeEGJXxzWWeDgQo69Jj7lSd8nRJrVoQI6LPahEqXXipQ7EkQblutk9lotC\nhhcIRQwBiqHjbaItOGdlHSC81yeBwWKV1DbRQfacvvDrLwVhukEQkR/BtVxd\nBNB3\r\n=ujxZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICq4W+IAI8wpxYv8uKjVjXZE40AYewKH3Uw0FRRxATHJAiAnE1r5ts/rbefvfzxU357QxFka9MQ9r49bJV425ciS+g=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.6_1572946861121_0.7667036997857033"},"_hasShrinkwrap":false},"0.10.7":{"name":"@react-ssr/nestjs-express","version":"0.10.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"54c7c6acc74e0f9df176ce89515877b7c685f1e5","_id":"@react-ssr/nestjs-express@0.10.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-u49j24XdAGYispNZ/Li+ZKmt7C5MviaanqkrncZtarp3Eiy4oCSoL1P/5DeE2elPslyf+RtFZwpY2LzLSX2LOw==","shasum":"25a0f25bb3134427c8984bc5cf94c5a947f500b6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.7.tgz","fileCount":8,"unpackedSize":13707,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdwZN2CRA9TVsSAnZWagAAew4QAKHi9w0cW4kRLwYTveSW\ndUfC3OIb/dX6OPwUExs/WscXOfJcyGgQ+w4Qg4VcuozAYq+qS4A+oTXFiEj9\nY1PS68PdZPuka2GXwl5rxr2owl/9tPDeeIsQOdjOCHNIMxb9Qm61NvuvQWKO\nzJABnwOdbbb/JYrkLGIdak8/WIY90nqQ86m17gjbO1v9lfngtvTIJseeslmB\nQu9zDGVk2G/uZogEO0BvdQ/bM73zihrvT0tFX57Die6EJ4gyozvhwKglTv2K\nJ8+19v1/0KpcwEu4ec55eABUKVgaZonUwa1l0astSn4AUUji6rEUK0h9ln3v\nKnGaxcE1c7Nk/9pDW1DGPfN3VOHM2jfekEwOLvxRimmWfBLrzGAIVaZrwG0s\nk9035Onxiy4+k8COoWb+OBK5RoC2+zgPQkw0j8+8nXJ26aDYIve/XcX4+uwF\nJmCDOU2w9w4wdMYKW367/nPpYgMdacyq2Xc9zPz+IziDK/NzeBmedFh38UaD\niFRB7iUQYLgBgBe7GMP7OqymZ2wWAvYOVAOxUxm09i/oV3e3joWscqHdxncK\nBpobpzDZQem+zbK2pTsF1K9qWoIZwE+YrJNQlhuJMd2NkJk56BIjhN4hmg7z\nsGCv642mmuWGswdpJuQKv1aMQbJ70RK6VITK2HF/MvNti22PLu3iLcOE9VM/\nxfWt\r\n=QoTD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCtsQ3gUt+7AYtiGZ5N+9yCH4XFiC4aKQkBTFoACIhTYgIhAPXFXZZIqt/ZXRT+flD39aWO6ifSpdACGVPS0yJ4mC4x"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.7_1572967285988_0.9254483505228328"},"_hasShrinkwrap":false},"0.10.8":{"name":"@react-ssr/nestjs-express","version":"0.10.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","@types/react":"^16.9.11","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5bb8dead996a3067a4a98074f69ad5b1168b3bec","_id":"@react-ssr/nestjs-express@0.10.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GQ7v8pxmIiP1uNMCVMqPAWhaCcYynMgxX963hSytABSmo+NHC/P5gRKc9Ntks5W+6/CsF+wzJ3NQWE7T+Ks99g==","shasum":"1d4575061ac570306901f2c8932b400334609057","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.8.tgz","fileCount":8,"unpackedSize":13632,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdwnNjCRA9TVsSAnZWagAAYmEP/1o/tIPDCi4P8IMllNLV\nRh1Yeo4YjBZT5cndN+8leUlKtTFZ5CjG1RJSkBnU6g83uJOiCH9+87a9lOBa\nozBpcKteaXAICP9ZOCyN2Vx2xrkrwlbhApqZhvujws0fk1pvrNdvnQgG1we6\nATNvfeyF55vn/JxRjGIlXXtn/JEd18MuFNjMK+FYzak0PQZgCMAXnVvy6cWL\nrnfxiaENDaeBpJ/ZVAIkO+GEAJk0GkjEprpqBJ1F1c6UzteNNw/KPVCP9vT2\nUO6OAxNeTpi8u3rF0lK2qihfsy7G9fG3N8BFZk2dGuax3GERu86WmOye75pR\n+VEk5XlzPILwaRI7MSTxc4OeVG0Zjp9hluwM2lV0PHoSyJ77lEi0B4WmzVHc\n6LphlI1gZW0zKH7d+nt+2DbnEub6jNW48LeZiUIfYLRYP/+ufzybxW49oA3j\n7J5i1+qXBisia3c6Hvu225cTlXmgXFnm0/Dwoj20EQGKo5WEIx7lrmuYh9e8\nEU0UYTEXNwU8toP0jyFhKNpdKJqAgwXrGKOQkxG0nAvihWRs1eYFdwruaGES\n09rGQ/W+QJDuvE4xG/xfuRz18RTsK/Qck01G0/2Mb38gp8xep3zKwEGWiLDq\nxN+gdqPRUjnTIJ8MfvGgj9yYdkmumBEbN5p6LcRD8YS6j6NUnlRZpgt/vddo\nXx/2\r\n=qSup\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDe9mmnbKg/KdyIO/OtN6YXXhhFcyFSXAz6bddXCq0mhQIhAPP3zKNyY5Y20erVCOPjmH3w5LE5prZhjQyqebv3spIl"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.8_1573024611439_0.4599096883938856"},"_hasShrinkwrap":false},"0.10.9-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.10.9-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d09d4099be6f2c144c09df8b9a8d02447a033edd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.9-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2mvUTKf3JTgM7NW7ciBTy3QUPlwKFlJVYrQvrB0KuFW/Yf3h2QOydpTc3MuENUXu7E8zgm7F5EIGx9bcN53TLQ==","shasum":"9ef248272ea5c661a21312f19297550195179179","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.9-alpha.5.tgz","fileCount":8,"unpackedSize":13616,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyENYCRA9TVsSAnZWagAA6joP/2kVPongRUqZdzK7OWNL\nL1hY6wBxhMHCXtIY40TBp2m8+t8np4bmrB26F5ZGTbJEiJHYj6rGEVPIVMcj\nhMgFokOEVW1hUUWjHQaYqn1ftKkft29F5wuHIxWljFy1gUUyu2HIkolgln3t\nq2wnpzwExcReo8Oo0zwXONhuEBUxHmfJrwUv1ekrgzpdYXRbvuzWeJtqFbAI\nESlG3M3rgp8YZXQFSObt5ic+8n3zNoBQN/1Bi8oI0mqByZJhWYKIcMM7c+Ep\nuJxpn1xBTz9zFdrR6lHdPdr1U/y4FNSUOhRpCs9oLHHkhvzGctROTBqBNIbN\n53Lf7RM3erMBVzUPcJMpSJynfySIwSxEfE9Kl/y7uD4nDijeINRxkW3sQr0M\nRF1DdAFo4bYUjzwACPq6r8CPTxsdYX/IfGWHRkZ7TxFVjNUJy+jyRHZdreSM\nBDX1WI2gu9WJm3xynf1XrllGu+9UvpJQxX6F8u+MJ0h1wohq6uzRPG7ba5e2\nLXMQFYHkJOLMVL/CswiScI7bgblDPj4oRGbe7SJ6E/QN7mlOeaqISbF8TJky\n8wZ/BjbxwpaWbU043Mc1VyecwR67lw+RbnLdHdUFaA2Fd6RHrHzebbXuYat/\ngPtUvOVxAMxK8azAp9MMSESq7QoXA+Zagz9phtzQuxSk0hUiD+YdvrHTcWOr\nnUlZ\r\n=aFCo\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA0yXWnhwbHhrmW9mqO+P8g1cwPBQ8Pi8BKSxtzJbVMCAiEApwrGLCqsHZHpV6EjPDMsVn0beErJCd9Ft/7vA4OWlAw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.9-alpha.5_1573405528212_0.03184522362943598"},"_hasShrinkwrap":false},"0.10.9-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.10.9-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.9-alpha.6+e426a65"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e426a65412a07c9f288546b6054fe33d00ac2233","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.9-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-emRtX+DoyB7TCkw9Ruxxv+ekRgrgs5JSLG7gLb9hJRy/BQ3J0T4jqOvMHtfcNE8skGKxNYgBKZ3tlxcQbTzHZA==","shasum":"78f9bfa2f5c935e0d155399fd7c852537e60a197","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.9-alpha.6.tgz","fileCount":8,"unpackedSize":13632,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyER+CRA9TVsSAnZWagAA5igP/1JGXbIwKRKq9NXw9IX4\nS8Qh28F87l7CQQ7/5RRB+hL8pJFxsMpdSsBzVUc20ag7zmVxzT1KJdGDwJFY\n3S7wvkpZA220kVR/FD1/WC+1Ue5gD2XPKYg7lgTNQkGdbLcVcjEvP+bowTyA\nfdPl12TN5HgwFZ4yH4L1Clo7B/HxkL6SbewAcvrsTcc1bl4i4cbqk+HvcBRV\n01B8Esdj986UXZkOWVd0/eWui94ZWg+6IQ7kpa3vPP91rmLazhn2hoYTPBWp\nbPU9kDdAqJ1eovFJecbpsxLX77v/kaAFblSxiHcry9AdIjiS5+uvHr2GLgvP\nVNLy7DZ3UTKVp1Ega/17AhEvaqG8fxdwiC84hF8tENkruB6a/K8f3PVxQlsd\nfiTO67zugxwEZ5K37y6ZVbl2jFmJjzIBMYMb71WPvTmK8C3rvKn6MLvGrMbI\niQIQPrt9RUbzvE83Kci9yY2vERCBxVxGamOWJIhXhFmFdEw9uzD5Cs29iFAq\nl5iO+0IOXP93wOCtpFb2BEyIrZQBfRozWEtBnXeMajArbbbkb5+grGVSJ/3Y\nkL/ByuEcZm2vlkmvv9ztu20bKP14G1++AB0lSuwy3cYB+ApLgaPUgMDnXHcY\nHU4pYoe6I8IvEtwHOfJtGzBAzNfvapHij3KSz/PgifhvSMG39wz0Fqfnw7AQ\nmT3L\r\n=1e7E\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEIf+hZpe/fgf5WHd1eKEpwTSSyVkYP6iNPX9iRNKXD0AiEAp6hKWR0IEOTChHc0BpqJ7NMAlKTzKZaPAN3j2TY8qo0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.9-alpha.6_1573405822185_0.776426564512062"},"_hasShrinkwrap":false},"0.10.9":{"name":"@react-ssr/nestjs-express","version":"0.10.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7e38e8560dfc94442af114bf81ecd1ad1456dee8","_id":"@react-ssr/nestjs-express@0.10.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-j/AvieSIjxnJta4192npOBR6CvN/7wAptP/WeaFOiMm8I7Rv22KIm4wM9ADn/ZIkB0+GZDV4fl0Tgf4y//rhWw==","shasum":"bdd9b9e711a1e656dd4ce98edcd15732a59dd189","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.9.tgz","fileCount":8,"unpackedSize":13600,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyEV9CRA9TVsSAnZWagAAQ4gQAIlzys/y9SQZcYW/rLvw\nws9Kwr2R16ci09GsYa2wlbE6otAkFMwk2dG78ir9LzTbI2VsKxs1uUCnqHac\naj7E/GXdkbsiH03kcxMOkOhhkdH1EUe60uvs9Wx7aTELPbXNXshZqTx2qBcr\ndY6n/KgzYL9tRKrT/94EdpPHHZs1PXULXxGBqxGk9bSIi8RsHwLNzDC7XOQw\nnU5ErP+iYeBy0LXy7zCSzLMVQxPLvtQlfBdbdD81Oj7tO6AvWJgwxOBYIYbq\n0r0tquuv2cQr3x8Zv1qYSqKkjBSqYVG38D7nWVlDM+dnoAr3BD3dDI91St5X\nrklKjAA+y4b6IkIcPFsAu86G4wUKbIcIw38xPpMyOZfxKRNJGsl0rPXs++LP\nubYJ4YtRV5R6FsQQJxYiNJFoLzCmH1q8Q4ZHDuIxZ83gDcf99tCn5iarMAcu\nKI/vGechqML/Xnvu3n16OR3l2LaNsMlKsCEgDZIW9aQxN+YDYVPJiKgZ8jcz\nUaif8Y/+Aa0VnIXcH+jcZ9sx9/floKj5u0ioSZF9J8yG6PjA/XxGYltAuF2k\neCNY8khn7G/IXaewgscNuKqpx8nRrpfWks3/ysmH1Gtm+Y4im1mSEafsAf4k\npFuX7WkN7R8qErYGl6zHPfYPDQqOy4KmPXM3pN+8g/vIW/K5mxIdUE32MMZm\ngyyi\r\n=vp4n\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEHBO7SK6mYHzG0klouIzFMFBKzipPA7VOB8Yckehd85AiEAzT1hkvZReOJClAcStogFdnfrkLajK+MT/CFlkz1rSic="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.9_1573406076802_0.9452702284198706"},"_hasShrinkwrap":false},"0.10.10-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.0+1b18e28"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1b18e2826d3af7e44092dbe2b760c914680f445c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Pm29B6IC342y1/qvjCcK9acoUKNU0Eg6PPRXAcYSpTU7iF0IP7HO1W5xa9unRxJelma8dIRwlcX5Iz8SwQMZrw==","shasum":"9ed06b168e41a70785c1fc6369a23301cfe30d35","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.0.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyFe5CRA9TVsSAnZWagAADewP/0O5UoeCMGuVQT3FyFm+\nF17SCP2tgcCrunXGs8NtLPGIhCvYFQEEyH7ZrZZc237Iue1wXPZKw/XfcuOf\nGr6COYvs3ZmvdcnYlzBJZho9BTlxsa0Y0dsv3AG+pCaRMS9nfjVUgFk8k3po\nxUdJbs4xdlHAS3tXWD5mVbcdRJduCOggsyPhRsnT7pO6NJm831Va+yQcxoV3\n3Soy33/Fy63XfpNcOxG2ZQ638zTAgDuNuV3OhgP0rplIW8Pip+zGKFxXw2b7\nuvKmJz/kgH9vxE65/SUUf5k1i3fiYst95QkRJGJhGBofBOM+SadxyAE3+THJ\niUsbKJ5B+idgmB8pAc8lUpFi2A9xEr41v/tGSUD55iEVWBmclnbQqpUSNXXE\nTqrJC/yH2/m/d4ZwA7TkwwQRaBPaG0GrWX0uw6AMfH/pIOPd4eXydsaeUmEl\nvPIALAv8vkvAseXqRMsUiEfK8Hd7bc+j37EuqullKnCjJHccpaX2lxDZ3raF\nWd7y4Ov0GP7ublh23SiIUG51+zT0a2sgobF3dta2CG6XVM3kWYl7kJDwbdF0\ncWAm7EiDFK8bMxfcjfi9tQXIS+8r/2FQPGCu4KzGNQc2PRKQ1o87+uR2K5xT\nTKHwuifEF7Y1chY+uf0DRj68F6kZfAO4bGZFoARwJlNR6bCA8enyLorYdPXv\nL8vT\r\n=y6uL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDBexpFlyPR4xwc8NjXviChtr1OsikYa0lBxWUp9uk53AIhAOW2drCtlPLZnvALvPsiZ46pLa+t/ZbBpl7jRUFr0YUl"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.0_1573410745227_0.5784984882553892"},"_hasShrinkwrap":false},"0.10.10-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.1+ff9638a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ff9638acec52c39a02401d77f4cf1281d00880c4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-TujDFmskTWv6QbXUmle8ASp/neXU+VSnZ8Hj3bfclPP5j27cDvI7box+FPr7Jjp98bZQnIrtzWO4qwAty51A5Q==","shasum":"9d50675ba57f84e5c92e7f3692fc0e7429c35372","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.1.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyFhPCRA9TVsSAnZWagAA5PgP/ibOWbWkb/C9oCa1DcMv\nJ/MZb8Mg3/QSThT5TJw2sSgQ6xo1q0jJnDgDjmCek5rPncXwYXrMeZqUlo66\np9WQc0KsU2dIOM54ErClWj495GvFSzOrcXLjB248MqRQKVC1qgek/AwByC3M\nzYYZ1ADZo+E137DjpW7bin7XRcT4EaGnFVuBuCQHLSDfS/SnHsZRFejRYpEf\nKvMTPboyUPasaWBrtpQawNWmS/zEPr3Uez4KwJ62T5U2xM6yvsaoM0Wmwv1I\n4R71ONr/gdOOEsJFZABO4KVqm1czY0yS0Ma2hmAWTObrPe+Ry3ALmd8xPscF\n6QxAWe3J/NapcLG0E5DbCdpZAx2HkrlK/0vV5qkHHBIX2qoEcx+V1UtTTkDD\nyoGPD7qYnFsVJhcs7eHUr2B4FWV0LSTcpy0Yah6btCNxATgP+WuQpMexX/B5\nNwO/tOLlKSbkWkeDXb2CBrenS+lORDEEdLJcCnApH8O3J4ObcQchSuKDsVlE\nNLWKoTD1nxJqdPtQ5Z85LPpl6FANfsfGynuIOkJXAhZoG4D8ggjJNdi6bbog\ni4F04xkbmYo60GpLRX62HRramPA/xq5bDdk9aOVRBun5eZSe5hJA3f/ujBXL\nC8f2ly91QzUv06tnllBAtFSYsuZs6j+4EEdhlMSzgmN9pOjjAQrsw4U+AKgx\nNk9A\r\n=xUNp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDn2kGs0ZTNbvoIoeFHrhJbwsoSI4y6Y2FepII8OFq7yAiBtt//+u4M4O3a/I1z03HDJ4QOFTI4wWZk9qYtZLFVvYw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.1_1573410895119_0.8725988577888257"},"_hasShrinkwrap":false},"0.10.10-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.2+5c96ba7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5c96ba73c120f5d149cf7255a50cd0e5e9f77970","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-N/wtGD9eq3NZFCCdw+vNgnK7I9SGC6Z0eG2pDKP6TzXqcioprmtEjmzwTfMkwqOCXRatNsiYPcc3p3ih9vlSbg==","shasum":"4b7c65c726b30ebde7abaf7346ce63cb47492f29","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.2.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyFkwCRA9TVsSAnZWagAAJqYP/jqaTqAhstPMRbBooF4V\nIvkb7W/HIQeHRJFPVvn+DeOsk+GqnPE9ATBXgnsSUS//wQNkKEDmATpr5jcU\nFNRiypS2GOmHGsGbsW+V3NXLiZQbyXivtpR3/x+MbZoAPu415Urbq+PETbrj\nVZjqjuXGfaQbQkes/VdV8Rgpr0a0Qch8ZP/y2a++jjpWOXDn7cPS8YVvdmay\nLnqIsfl17OXnYcy5aevfSTsX37ctVm1FGIglU0BtF5Rx5YzSZcb8QaNn2w78\nLzcl7fZ8jvVqkbiMCiFmkO7J7ODtKGUB1bIZAegKYqbwnthKrFgPgOnnGQUl\n9A9jUjBXofcDmqO79RYUIwKzIw6M+1OJsCgC6LECMR1+ZS8YkEnUDYMoxTHh\nI0O+xuiX2tu9viFa/eEMExTk01zU/EW78wf8gphY3BTXHxtG9gC0Mh7w2VKN\n+EG6Vg4evQkfP4V1HYj2qtWTbj5ujiN9/WENub0BJhn6/5yAwZQyLfHeLJ6N\nkCPcAkEWobgoaYypC2Nteh/1bB96j28SM66omAFrXjXlqGtsq5FlR87Bbp+/\nnArH1grdrZ87Icjqq3Np85FZDCVVDEqAw2ecSmWrYI2ztEY0SdYxNwGgHv75\nI6C9KuHMZ1R0gE+GDSokB+3PiQUr4q2yFSRwyO4sOP+ExxPLgKrtnk8ZtI7C\nFTTo\r\n=0T9Y\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCgMT1w+Avwwkl0zaBZem5gVwMm1YxHHYxcaVSDpqeFFgIhAJ2bK9GlV8N0zD5UfBo9Pch9bX4YjQuVrrwVSU0GkOPx"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.2_1573411120096_0.22067520235010885"},"_hasShrinkwrap":false},"0.10.10-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.3+41cecc0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"41cecc0cfb20b762126c809dee9b8522feb16d6d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-d+pivdoTw+5Q/W+3XRC4z14QhwSBF/4CGxC9p/SrTCNDre8wp/4VvV5k4zStrnknDQWfVre/X0XPHAwRpdHeLA==","shasum":"03ab6f38e8608f7ffb907d42a6a6f545a762b6a1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.3.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyFlnCRA9TVsSAnZWagAA8xwP+gKupIz6AzUee7XOQEYq\ndubViqBFYk4/Cz7XcA2ruXRoEsnHZz+5CoK8LetJU+qWBvwpz4waiO8/t8V2\nEszbBmmmr2SFNAYK9o0BGyYqfBF53+qBJ7zs+Up4WGAwep7F7YGXCNLi2L4X\nWmT1ZvW+Ogi4vgf0t4zfCJP6eSVFbPfimUVd6P2Z9/brMpLoftzy4fX/exm2\nmNvBLzb8QfDuWiX0fhrIK0/sA8hO/V9jDGUFheztLL3plokPzvb3/cQA1ejT\n8BouYTRggP+s12vu9rvQCm2fPwafa3Ml74TpWWAteyfXOAhb0OpZTxy4s422\nyrSIVhu1Tx6t0yMBg54aOYQxzEd72X3d5rul3Z9qh122/Ch2YQGPyfF2S7Fr\nzKh0EqXFvKwGPrGGm6x+CZPFB+GlVtfDxu7CAB8Neitwe37+p/ML+P2xtCza\nfvPQqT0P0gz9z0HTJwATr5KW0BGJs8nMQEHXtna/KHI8arhcFRyGRAUfEMWM\n9a5F+FmKHaWQIJ256rpnQ0ukfknAfEp19Ic6GP6f9N94yTCp4h+hbYgXX0yC\nIxpnc4IxHeKNmmznqa0AYnylprtlyllddjg5beIrq3UpvYvTo+OXLmBGEyWA\nZj7Kcdhxb4yUk+stX5Ie+lld3ygLwpNDUGJlBzXzdlq63FbqBN1gyovRwJvS\nhWvQ\r\n=3hV1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBT/GUlUQn8uxes3SjGE/FlzLWMpAyK2VxXLYy/3otcNAiEAijc/dK2FJKzBosCMsR+9jYI0ENT1AeLjT3BWX2VCep0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.3_1573411175452_0.12952714527888642"},"_hasShrinkwrap":false},"0.10.10-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.4+a9362eb"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a9362eb4ffac25774a4e250a0d1d3d45446f1821","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mFVkrHV855SDX5Qdt6BbEJDpocuo8dD95XSENPFSBK3Vs6ieg2xu2sZ1DC2oUGfmD+j7mLxoAkAJhFp3dZPkXw==","shasum":"0e5a6ae04280fed46d8c6098dd02ccb351a76e82","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.4.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyFwWCRA9TVsSAnZWagAABUQP/29CvUCnoWjGx9xzc0Je\nTJgmK8pHy2SQUzMU9CYvYyhxnh5VfL1MKZLIMVFreGoS6N3OxmBYf2gaJuXZ\nZIjCPTyWqEJYgvXhPtBWHz8Sztxqm8MlPCRJrRAcc8KOoM7NjraMjb1bClrs\nIVbV5rKznZLLymkM38GpuCEHrV2aIKQcoAoc2VIQC6v2F0N70xzOgP6Fg71V\nXzQaDt1wJAsb3iwwLpu8CIHtKHkxeWovz7pfdEUjmrWcSPFeYva65/QRLr31\nj7O0oNxy55szxYa8BQnH5zikgqKylddte5bYpoCoQTvX1pHiExXvR8dAQeu+\nJigTM8PzDQxqv+aR9i1DLIzNridsmKDU1bq3hijtSSUsEv0KMkxE7SnHlX2b\n1m2kLc7soxfNWO53MLfGZTsDnCMTFpOfGRp5oeQFPXwDmS6RsMfluiZCa4Yf\nk8X+JvSynqdchHGC0+gJj2QkU7UQF/84f2Z60G6o2/j47jJ3C3iuZx1NOxXS\nuz2iSvtlO6foprF7qfvFjT5ZWVW8VAw9pnGxjibHc1CYCmEfnuoxrt09f6Ee\n40sNBKNhMgnsQWu2HxE+AA1/HJ8Mtz2GScp0FCnWdapUoB4vopk36cu7ADO7\npVUhYuboEpf5VU5rMZANdmiMCnQTI9F8LYDrmSESVWj8/DibNBDJf5ZPpztB\nyP/t\r\n=Tud/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC9F8Lq6M3I98yt+7Es4g147CU39gGN67+Q9sbqzKtxUAIhAJYeroAw0tCoSUcNfgTHyH6NFLS4OLlh6Aqelik1uV5T"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.4_1573411861707_0.33510823480242813"},"_hasShrinkwrap":false},"0.10.10-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.5+a379df1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a379df1ad38fa2bd3bbc683984c852dd069839a0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-FIs/K1GEOhQkRevaAXb5Qzo+6Xd7eJ8/u/3Rcji9phyfvvj5Ge5mjU4U7IEghg+4TS62eYEVDJXL9UMsAgi1SQ==","shasum":"68ce1365c21b8c4c86b6230f1631eccf96dfc456","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.5.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyGUSCRA9TVsSAnZWagAA2RQP/RKYg3H0w0XlQ/8KIX9s\nysPfZ51/22MzY/ckcfvRKfhWc+XGK+kqAEpgt9jEXyYxFOw3+mKm9UHuwUnk\nQfOWssXABLwBhDUC0lWxnSGYAKhJbsitipx+s27rm0CFQGSNvv9fURRoXhiV\n9ZRHSKEUAmmJjO+5132Zn7hrZgg6GQcgDRjfY5hoq8LvL6msZDUiSrL0HAT4\n4LoNC+7c5Qk1CdXhUGCmP53iBscxZ6qwrQdggwQkBvFa0V9BTLzbfQt0PUNU\nx/mU8xMkrcQsOQuEyt3FvapnnTqfH5QqrA/dQY2Jli0XyCzLsNa+cl454v5c\nz1CntvkXNu/XsRk1YppiXiR7FsKqsLY58VaxNG3oGCWSCX3tDcH2Jcc+wuB/\n2XBv5oK6DL/6G4noEiwe83QwvxfD3AfE9iZvWJ4plbSU9E48ht1kVUyRjI+G\nSL/eJwthOBZbUA+f37gILX47ANgHh5JDy5OCA0pvmh+K+PBUlxNFWhAniEh9\nlSRHjxmChPCNr1ywDCjRL+Qf1k+HI5XC0fxptq8UEnnVdyH8owY/Ozu7FDl9\ns61305GOl7TC1PO0jksHkJYVSAXxgfj1la3G5UrXDJV0C6MEdqes2ls9zThO\ntONMqSyGRq9bYCj69T/i5j2jlh502BaX9NnuR2BNFLIC2LZtpczWEdzybZDl\n4Yo3\r\n=GTSB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID0IyRNp1EG4fRdynXxs3IV8D4Qkmn4cGm+LmZ+ZobW9AiAJjAle9E04RKSBLpdfWU+om54HSvx1xoYjFgvIGn38FQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.5_1573414162312_0.5008368940152288"},"_hasShrinkwrap":false},"0.10.10-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.6+30779aa"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"30779aa24ff0ff945ff7fcf13b6020b06f067b8b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-qVRMHpgRyX4NXjit5HAqvGZcJAenxb3qGPtRBmfCsl0m6KV9Hw9YLCZV/w0X2YsDZTsL4dtsZPOcBgqELw8gMQ==","shasum":"f6c2ab6d1a9850a5f945ff52a2f4fac2a9a4078c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.6.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyGXzCRA9TVsSAnZWagAAmI8P/0JcblvI1KEVuesALpJU\nK7Z0a2PwCMbaWT4JKHUNQDZgxwV8NrUI3ad54NvxKUEVWTum/VVLwmpV+yga\nnWKyxye7wUzb1jFeULAgDlcMM0jLYi6Dgmfjk4r9HVPVXvVBhtAHxM7APisF\nEq8GsB7c4jFU0jd1afpuK2+sADuNF2o2LOvB3SwqbFJjBgFaWEGVZQZpSGoK\nZKkhbIY7rr5j6nbwoRG3+DiWSmNwN3XEWm0DHdnd6LUq+Cim9ZM201XEncWu\no02cZtxlq6CD/3ogxtlzsc9nWVhts3dj8m/NXHk2fDHin3Y78KeQL8Y3DQz+\nCQfFG6xmfdV9aEiBK5DQXr68fe1bMZHoUepoFyFqn2wlULtqikHbqur8d+Oi\nj+8wHUAC5CXc8qZ+UOVuf/xd58dCKhUnlTd9cLHQcAN+NSsZbJuwzI/b1I5d\n/0j90J75WFQXyfthjUlIVujBEMw0f5msyy0+nxQmIvFRmhAvGqtwkHVKQn6I\ntY8P8S6BrtS2oXpqkvqOrWc7cvifBOAX7jX5OWLHl3m8Y2vyl8zxJBn2eiIr\n27UeZgsoFSYTOR1k6BECI4Ly1N7UQTbxASPHYn5ZtWpwsa/QC89vnuCA6Fvb\nij81yS1RH4eDhMKZlpVMuLT3KWrNOq5n4Szz2b1wPxr3aKPNdL6ic61i10vl\noxf7\r\n=jA+g\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGq+7tEkIQ7GCIDbEvlq4NY6sreIffMUPkWzpeJj5R/+AiEAuliM5yUhhpiaib6OCkTND2eq6mMgzmNt3q4FswDY71w="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.6_1573414387354_0.07354357933806543"},"_hasShrinkwrap":false},"0.10.10-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.7+7115c11"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7115c11982436e850e4097f3947c068016378ad1","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-nVXI8iniyoUBFjO9mqCx7v5UKrVAVNNSObbnJOdzlGcYMfyeMCr8trSyweVhVBvSOlfj6waeOz69HIQXR/t0Gg==","shasum":"6eb1bce6cb47d1fd8552d2abd1109df1c951b8c3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.7.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyGbvCRA9TVsSAnZWagAA4lkP/0IIDoVn9tATfAngaivH\nVQgD9bPGhQJN7e7dlYY6f2TUywVDmLGAVrkHhnHPAbFKVCbjX9jhUmFl14wr\nezMKqEBYCRyA2840AOy2qwF6ES9+8OLxFxbrIT4dQEH+jPBowcsbD8IcKMGI\nsPFuJ6rY7ziPfPv0Go+PnBhf8NSWE4wxnUA2QgUKiQy6rOlYfiicROuHV9Zh\nbkRVZlIingHzwBF/NqbCgvtG+D3dImgmZKNysE4ePXlad9JS8LqYjuCEKxQd\nbfIAK9MwlY2RDU+pU41nbRNXWPNd1se5JAvTCsz3DUzIgvHJ4fS+oxzyl69z\n2xA+HXFJPxDaElvX/4lo6JjQY8WzsFC7oo4kOzBZvQRG/27FFRFywq0oIZ8r\ns699pfzZ4rjf6U7vEyxqmgdYnVRwf7429DyOe3FV4zLs/C0UGpk1OdtRSIxp\nRoCUvhqrsLAjQsqYBkhww1d9tIlFLsbnQ5LenHgcZEJBy41oW7w09lVZOVdW\nFI7vhzE7wPTHf6ZXLVig/75B/Hzxn/zH7wH42cO8VE33xXK3F361M3wht+Qk\n8T4uOWmWUlTnRJJuTYt16U75MF8Ij0o2arZebf4x7HvRqeG3rXQjtMp4/AOf\ny5ulBITwwCC5J+aEgOiA1v7e/2Os73jjfbHNKv1KlOKVIKWgUGnZXead4rrw\nr3XJ\r\n=LHm2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC0qEmBmqUmn5Vt+ociQGHE6oynrtzyXtzaAdPf8O3UBAIgPpyNeBpZLBzDyHWWtBNvbd+lQKpbnRxaUqGy2Vt2fpE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.7_1573414638948_0.41943115612910686"},"_hasShrinkwrap":false},"0.10.10-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.8+e6837ce"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e6837ce3b8ead8f70c322b36bbf63bcedde877c7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-XdV/SyTP2IF6FU+Sc0VyLuKGNDR5PiHifJTB2hSAhJ9yjNvFx83EoNSRH9XyUlPjwMFWj1Errw8dZUkTRSde9Q==","shasum":"74078c9e0b69e1564c1ffa5eb0b8ebd72c1da715","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.8.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyGfxCRA9TVsSAnZWagAAf08P/jV6SPGS11nSDzNBaAcs\nSqlsEsdEHVA70rvDDr690ROlY+bpy8SdxVecx5PHGwNGScuRVRh+95ZeGi8r\ncKIT+Ic2zZCXlxDnurSrWt6T1kejqygkXlocT4yTZD46b/JrPS55c4Ds+76D\nSJKEdx3Uuq0hVQvS5H+664zDr2CcOyMzCIGMcYGOoCla2cfIW86InP0EHQTK\nqLLJ5NaaGNedt/IvTaY21MxlhNkFXtrbW1nRoNhy9XcaMUHZgz//zG74Gf5m\nlzn4RX8fCsldaXfxqv7DxVW+n63nUTFefDlLhQ5MPNpzfQvA/uMU8YIenEG1\n5ueN/daqeeSg2g0i0CmYSfVh18EXhREv498yW5dobrMV/WTK766LdsEnRJCR\nQedv6AkPBpO6iB33DTGIqwfs6NWUeiEutM+UmmH20GsfygXPDaGSLl9uRkEs\nBC1s1XUPiVnY+7C/UsxHYVZMtkRFxK7RjDUV6FR5jjEy/68Je7kih+slXDTB\nlwUQCOg/4o8lWFg3qeABMrw7KeCnE97N/2V6wXXCmHYXzH7ZyRmxR1woPC3S\nq1q1IYFU2vB5JSDIIQfL++y3lA2W+RlyN1OaFdxpO/5ePQyug/Cd3LL7+Uzu\nTrHzyNZnFtKzUs+ID1dp5cKyNCMqDjHkGjSoMPCeTyb6JldN/XY9q4xa4cmI\nz2P2\r\n=wmSl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDKZZ2U2el6o10i4v4zNvdN0qJpXz97+ITXpdZeLPTHyAIgdJsty7kePAd4cxCHoTDIJqDemvZcONaerf4mSRTo4Hk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.8_1573414897394_0.7141167972203364"},"_hasShrinkwrap":false},"0.10.10-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.9+62ff11f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"62ff11f82b76cea95a0ee3b65bae277726dd0da9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2c3E++ov9F4ldC+XjVKDI+ra/+CfGfD4w0wwTCv5QDZVgfr/ksTn4EntfFDRSBZMcofgixnEc/g0hayeObHK1w==","shasum":"c9b5f2cbd946697f8dda1392e0c00432aa13ed9a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.9.tgz","fileCount":8,"unpackedSize":13634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyGhwCRA9TVsSAnZWagAAYB0P/0laGWVxuvSlFWU+wmVC\n02hu8a3S/YjURtJ580VCA8RBSX3rBTiz7ewgcwWEsYC5RLmBzRbMfUOX0HLR\neOxcDzISn102inHC1BWxfo1oQHrL/mvGdbEcY3RJKM4ey1xcoldKu11moHtr\ntqJBkQzpJzf2NQjAgDgF7kXQDQtKrHYpcwBWanKfUD9MWygrJ2D0D1keY72K\n3zTFaJ3m+wVydOksxQjkACtuvHOr4hcvZUVWr2a9SPluSq9o5FkXe0UBiqQt\niMS8UNqKEPJiCbeFa9ZdUH6OHRJ4l3HyE01NfIcAjDXmjzYcIX+LTa2mY8yW\nlbJjm/9Sl0WKyWRkc7IsTitOi0XYelEwEz7+LMmIQqcABUPH58SOHQr5NuVO\n4P/zx4PYFmDB+iIXb7/jNfsp1pagjbn1GrPxSOBdrUEL9n+EdsK0HDlFieKD\nk3n9eRgFPW3Qeo2xcYlLmrWRDnpBK+4vmmmiRDkFl7SeC2GaVXA6UEqVtYmr\nPY2ruW+dN8lbKAO0ZsJXXkETeEUai4vwMwnUyRUnKoC4GbiE92XkUfz9PYgf\n7a4xOd63GnyhkKLo0323Lx/zm5RJYzsBEve7ej4gMax5VH+JbZalEMlDAvdB\nuErM0pmgyaBXP0/MxZ2lE7wGOx4K503krDadyCVW+fyIsIM1BArPFgh+ABcG\nN96M\r\n=v/GO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHmuYVfLFk+5Cm2/nAjHa8wj3cwH/IAbb7SVUtyFid1BAiB+QJsdp7rcEdKpGZc3vArhgkpS8Wc1InAxxqssCD/DGg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.9_1573415023810_0.2262953350918171"},"_hasShrinkwrap":false},"0.10.10-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.10+ac065e4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ac065e4eab05274cfc5cc1737a761c46d9823e3c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-G5XPoFk1BOEIDIZGPX9iogFmYFlmGNqfJ43NeiqZgI7FuyZqBTZ6MfsfDXOrqHbq/xL6uY1VlEjuLVflO71zSQ==","shasum":"884039e9f9dbf6c278e2abe293457def0018a930","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.10.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyGk8CRA9TVsSAnZWagAAE7IQAJVgxdODWZaGYL6YbPL0\nXaaPqbPq8C/Qpr+6EmBRvSCgbhM0royWzzD9bvpeolREDl5e3K6q64pSbrZf\nbP/ZIBNFZE3JTfNAYkqGJMbWX2nA44CkX4yXQhbwa3syiiYsBbVmTUcl1WPp\nhrfGb4X1j1Qrnjt+RrIyobL1pAZ4A2P4PBmrADJE8e02rcTJSRL67nSIDKdc\njCxHd4HvTQEZzFLazc1iiz6N18YX4g5xmCFYnyp3uG60Iog5UO/xXfKyl8QW\nElYL/EwsIPZC5B/H+cW8L47TUGwY1yxe6bL9AOVjqI1kA+6yJNu/IlSnDXWw\nmGYEr53HwweEmaRrIAAQwfJFcOhHvMj3t+U0mAv+Vy9jdCTlJyLOMpk7HuKg\nrKBTm+8lmqfXssn1E2YH/QCLtOWvFX9a0SzbtxJ+Gh4W2Gc6/QsdhEMgvqEw\nZvFJOU+pggTZChVb9AxrcDoxvf8MfCzx4EXEtxhegqW2wKL47szrIzCsAhF9\ne+GX1pzvySmQY4DanSysEva2LedZR7c+UELYTOoI4nhdn3imM1IM+b6i99mA\n/cnLoPqRc/m9RsOwGPu5MIHwxiCOwGg3oI29PV5S+Vag/XZyMQaQr0Ne+W15\n037aVn93Wk6tz1CKLTMZumAntOhrNa+XX2Xb4gviQ1ASb/F5g3szDKi6VxZu\nFA36\r\n=8+35\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDIo+Q2r3mDqnX/BCxhfGV1piXZEt+MB5eGb+/N35rGsAIhAKTo8FmiUvfx+guvT6h9sC7P4nSpFtrt2ciysth/mCX+"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.10_1573415227703_0.38609977199534407"},"_hasShrinkwrap":false},"0.10.10-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.11+a2ccf6e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a2ccf6ef0ab82fff4b2f0b4c9839012f1226fe2a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-yfYVu74HN+EBEJ56h/kQnTCxUztpQiHR6V+WtwHk0I8DcMP/jyNjcSRQNhH0NnjtYlrBU30xJyCi9+7SkHwgUA==","shasum":"ee0000992c2fb4193efd919ab33338c31c29e475","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.11.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyGnZCRA9TVsSAnZWagAATs8QAIbNoDNraaLpYByzwlXJ\nVE2u9QzK+UH65X3FlwSZlit2tJKvEGAp0xpWTQU4IEFZ3xnCImmc3aFY/StC\ntmAtllC2qNAz8wHKC6EdzsFJlQytYYXxVWx0UuqC2R6qBLinXQP2MasOr6VA\nAM70XjrbeU63ZAiVEKWIKxLboixJTPhe4nX4RdzRzeKVErwD2UgSyBjrmnlg\nm7Qx3RTfjvXCqj+z9Z1T81+ioHz4aJGzMCc1dXfIBjWQjgs7+14m9pn63UYH\nA6BtKaCTCtaJed+0oBAyvhSPesYIYGsh84N10sNvrqP+7J3RaSInpYD0TWbS\nfJ9d3LGJejV7z3QRjcaR5grz1kj75kPHW4Ha/BSyxF0K2u1jxxzQTDClZV2C\nZK8FXLApVFLWWOxzqwRBzrE8fuR2VX9JVIua1ruJCLsqQJR/fHiVIPE5pJzG\nA/zwIxiT5WnQmy81v34G+h55ResTriNrLgP+QXkTvoMqJK8ejX8DBdHeBKGq\njmNIotZ/+ICPWKjIzO+OqbKc3RAGNxDf0jPnyPfg0AUCPyWpXiOFsPsjRAzQ\nI60pvnadJucfyZcYO+5erQRcadArKO+Berd72SPfK/DmdcFyEnWPUTGxBn0H\nOMavCEsdgkoMh3eVcLz0GWlmDbvJN97ORwpymhaYFKQe1vm+DrN5/K3Td9v4\nqrEj\r\n=Wqbb\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCDfKv2uTw5bBAx1C7FSFXErmmRQ7rvNPwSUn+8W3HXTAIhAO6i3OjNtJz9yoo9EOZu9LjJnIZCQwXQ9+BFFzkYhP6p"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.11_1573415384952_0.4568705546302225"},"_hasShrinkwrap":false},"0.10.10-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.12+b9e2e91"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b9e2e9165cd84fb4c442bb728fa302849767190c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mY8Idb5z6jh0yjQS2K+6IZDgm4mIapQoo2OcSwW/oP8ithbubA4Tl40AzqxrIQGKM4Qaraghl+qWD/KPYWRWjg==","shasum":"472896af853111678a968cebbcd4a99ba331ba61","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.12.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyGrlCRA9TVsSAnZWagAAUDAQAIvsjJA9FaI6Y7QQbcoK\n4OIs81rkcBJbIChOEse2ggFMRGz2mMUsLyn+4R4ICw9CsFq+rlk+cWeI48KU\nctcjozke3ijWdUBjycBVc92Z7yCkAHfSe6CozeB3JoXJmZSDjZ8V567Hepg5\nS5+nZ42RsknBEt7qdR+DGYfrm5D6TV5/WB8FVsSvKOoiLqn7ccn0GCMA9/26\nBPEP4FLgN38MAttIU+7guy7f4DAVaNffMAulx4MDC1nw+1/Ru2nbN6G+uRe+\nI0f4/J2JWO0+d0fhqv7SSgKcCzZHxkZemJUrRlT3OVX1+Ag4RuMllvqG14Hx\nwmrfMCFNPo+npVuAlAngtBORTJzYTF4TtSOsoaHg3qElUSwUvpClezrJNs7L\ngAFU7SZbFX9Di0t7q0GXiM5S3T8H3eC6atzvQtHNDhwVJBDbAQrKGmqxcUuB\nQHgK3j37V/lsSjEEHDSH/ImkV5bAJokU/Lt8NkNSpm03YQCA315IcllVNjJq\nM1zSaZoLsUncr7m0FmSYyx9ADCfi1h78AFgWguFDsKYDGtp4YL/HEm0LXk8s\ngbVDeC5GN/Tc5JZTG+oZq0V0nL3uZluueGC7Sy8ZQdI4RZVYL0l2ZmSaw/C8\nA1BuRV14ONqzHeIi4ag/HhpIqjDkItIT1PrKyTx8pqd/bZxXNrKUUm0Unda0\nKkPf\r\n=H+2o\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHsj+e5KKCUPUEJvR5maXI74ZcYxoWUatQgz1sOu8q+iAiAmhbrVXIDW3bmTakmbakez2Bqc5be6wPaIn8LicTRuIA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.12_1573415653485_0.7043644235996196"},"_hasShrinkwrap":false},"0.10.10-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.13+09ff908"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"09ff908f9c2635cc9a5db73c4dc6f65f7b07662a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1CAiL38EYPAuVj1tDgjDdKnhq69XKFU/dy1F9QP6fOh8ZaK6eRY7bUbz70fgGmD+aQcSLCBGcI1rH1hosp0eeA==","shasum":"462e99cfcda2b557569a0ee6076c590a09f0adcd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.13.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyGwhCRA9TVsSAnZWagAAilYP/0qH7ACZSZhRQKVPvmwl\npYovvHR0GrOQA4qJLesu3MQDeH/qnCbt67nTuh1o7h5GPTUaAEEiNMZaZ79h\nWX+FnAk33Rg8tTw60w8oL9XjH3ZzWYp2UpV6pg9D7D7m+eznnBS2F+u7zHB+\nvxkJPokscg678awW5oHvAyVRWCzZd8EqKDEGBs3uFEA4lfoUF/HwupP18PS+\nEtTvRxhcn2J7hEzOldYoWojHcLQLABOg6t863jjI3FGIV2Prm0SmUTrI+yqN\nlV3vKkuz7Rkr/+JYEOwoV7p82YfqxTDgAPPJUGDpYwpiYCo1/4ji5mZj/3N/\nmqiZevf5HTVNlghprV8zHFfTTZOYouS+UHS/q1/q4D/PMNCqpACAuZ5l2dl9\n6FvGOxlUGHxyZSZeYh3cYzR2ix595an2cvcnMpuz11YYlVnYow0515YJptfg\nOy0uW7Ba5YUlaHTiUK0tjC+MILf+q1tDR/UaPjCoHLHxFPALC2LVlTnq4Q4M\n9nZDnPOcwH6SJ9s54RRYdcJCfBATRacxMvx6MMz3Rv5xbl/j4K4ajPX5OKzb\n/579CuVTdmflHQP5vhfRgqIoaObsNQc+ZoSUSroLpALwuIAxNs31qWoi43cm\nDb0ylQK3ddhz3RXv0TuwsSNY+FUkJvHd0Hfp2lcvePsrEYSx9k0+zrbimWGa\nz2B3\r\n=c40X\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEUg5J3H/7f2yScUW8TRBLGQRgmEwoY42JGuYSDo5QPtAiEA1AXzz+R5DSvMadOJKVEaspiehojfGjC7tZzgNCywvOs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.13_1573415969474_0.6185680386503503"},"_hasShrinkwrap":false},"0.10.10-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.14+a5a684a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a5a684a13b716227afd7d8487c17846fadf5f909","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-gu3iFM2tFLP3/bCqihdwuHJLR6RU7PEl5/oY90yj1E9N43d1J+SaC6j2XtvMR1pyZtylfVm539yd08fezl3pig==","shasum":"929cf1d35a27e65709988b345c8615b1d8f99d9e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.14.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyG2GCRA9TVsSAnZWagAAOVYP/3sWofAQIsZD6EAhKguo\ndrBesSSi7TveoLNVhbyx/0KhA4oLfpnJ61HUMx9vxKZ2iCIG1+NVSQ4nRK+m\naIjeYbX9ZsoRNd+PXfAqKOwFqOIFxJG86sDe5PeuaUeFOROjX0J0ZOuZFB4a\nWYvogzfANIHp5kftIcyxjp/WS6WKAnE7mRZoMEy/JsF9Ug6FG6RQGpqNwIo4\noLyX/XxpSdqNDHO/KZOMXvU3pNGbYOTCCcyR31ZBeVvDtHsMHNyDJS3Q0uWX\nqPyhjZfd+S+gVMORGrkp8Nbkvpk+8ZsePNhVw3dXcKigX9uAgdoeClcgEb1E\nuRmjkncv/xDywa0qwTlaukxEJWpxNHSZYzs8N0Vzj71E6+JplK/RNdb+BVrz\nJ9yJa2ELHIDa2Z0JyOJPEY+31BYlL5kgQTbmji6QAtYV9KSq0kgTqmTh7Tpz\nCoqq/M5RqXzVobfK29qGG+b8/aMX0HLB7VO2CiCPsWlZ61c4cos9WrJ4C4X0\nQ1+st0VbQ1cdn4hnn8qqAL22K/y+VN5QRZGsWzrVFRNf0UesudH+RWl9lZTG\nkTncaUOwfhPWs09kzMwe/1jaUlYfAdWzZNCbozHdWwGvVScIfrWyfz61/cGF\n4HbmFxtkLd8S/pz6HBvbf5tnBtXy0HRaesVUK5mi1zCwU/cjKd1/4z9/2irg\nOC/i\r\n=H9uP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC5o7JLd5jYBpD0awPQG3MI3ByejBA4M4RJJfDnnXP85AIgfNcbG8cIjdMSFuWdIdVPYN6A94IS2H2kqFswPYRYlVg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.14_1573416326500_0.1260974516696327"},"_hasShrinkwrap":false},"0.10.10-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.15+ed59bb6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ed59bb6c10e3422e03169200060e7a78cab991ac","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-MrkL8F1sDnzLML/5r46Q4+PLqPUK4u7xHh1o1HShjc/uhgQ4AR2jz2gXxdTVU01vvx+ndsHwtTgKr8Fshg8yOg==","shasum":"e10c342e50feebda1e571317c0135e1a80ef9ee3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.15.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyG39CRA9TVsSAnZWagAAmoIQAKSYG9oW4dybfOflc+Cb\n+VtTRGgqI7nrxc2T1V5n9/RLJSyP6Z2wn8AAYr7rkhVbKRhCberdpg56/2s8\nqtklQr61E0lagOsMMoOZ+CCl2buife+p0rWF7qe9zI6Th0sqbZyCxwgQ4JhR\nEyh/nNB2brSNEdQ14SXRjOK5sL/i8UEqmJ+3axTM6T+6looA2I8M9xIY4d2b\nE3AuPKZBZLs2q0YCktm4+xRGiTHuNyVUir/2UyHBG4KmSRgl/xTJFrtAW22q\nYwBZrwhfxsOSxIt6amIYjW5xQOYsZuyX3iC5QFiwsnL5d8ga3sDnFaajm2Yi\nxGjTLUkmjxLWmqTEFyZiqBYeyPS/d1cb4SUoI0wFKUILu70x+dymQYrgRbvc\n8IhNQQYVXGNQ4gbb4OgbH3LrHm7zVVPKmazKu9tPXUVNk3dJtwVx3PrIUq8n\nvdr2QOK4K2ezg218ayMTXgsiot/yI/ViYmcaeB+dCdPhIq5FgXM1nc8VQLY+\nJ2KnXtSmlYgAxqsBEtHf/6ehlzggF5JjDE+T5TSFqLN272tCJiHg+TvznIxd\nDidtSMO3lZv0Aby3GBTyfSHo37ypolgkZRtu51ruTh4bO/aNPRK7HyeX8jhE\nsx6fSST7ukOQ633kgkB23237xcXx3MZIfi26LXsjfnNayB/eHPB+u5AGdrUm\n3Vct\r\n=9Xxd\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBxWz5WR7C4EOd+D3x9oClyoZlj8/eURF2/PQDia/scLAiEAn2eDYQIMW848yuUNkGFWxoHTALKiFeVhZn4T3C0WNd4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.15_1573416444593_0.260817392330136"},"_hasShrinkwrap":false},"0.10.10-alpha.16":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.16+a3f5deb"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a3f5deb1cbe9b5ce88801fbbb78311dc24c6a384","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.16","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4IxysdR3ScztNxePPdH5mjYOETmqeKNrBNoXadbkB98CtMCxnAVTtG1dM6ZhYLtDQ1kMywV9iaulxDjajox2eg==","shasum":"e5c5dda71f9b221b32e73c22fd3107a5499bac7d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.16.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyG74CRA9TVsSAnZWagAAEiMP/iIEFG+N0Ou7OUvEPBkL\nPmluOYfPRVy8uQcIuZl3YBZFc7N+wiJM9urajbc/QOiVuBNtKt+jyXFTITW9\nHPJodM7HnC/SksYgfiRBo0xcdmKxKEuW9tIL22ZUcOZ9kqmA2ziGXEutcqa3\ngJNa/PEvGe6LlzHQVO9gqNaJMPK+N8C93uUncta8dpT9CQjtTnOknqBpBR+A\nApCxzvWVerE/3EQUWiO6bHHqyzAYvCTnmcqsR9/g+a8gXYWzTeyDtaDajGgT\n4N8YYdFHqwqbMI0FAXIhGmTjkQioDf9H4kFtXcnylnLvnduUeDu1YSI6YBG2\naMZkFrm27dx49nJ3YON5R7oFWDsNkGrze4cfn06DM+r8+wdwfjaAB0cYNc7S\n7VnulfbdgAWeniOFwQP81VcoURgI0Onk4PstqSwZXaOBsDVibVgZtepQm632\n3jcZqE7NFq++HzeqbNfkAoAOG2E4kcG88R8+C2lQ62boozhfu46vT5kgorKv\nOjtpVHH21aaWzz82T2JkhPzSju+vyvH5mml30FrlbEZvOLIpM7igFVd5UV9c\n8m7n9zEkAs/J1X/DP/9GvyJbeLKwTjX3cRzm15qydTIkC3ScJjyujUNALuCn\nCgieF6Uy3ZGHuvo25azN0GPK6SaNCOj/KEVjCF1QSWteG/j2icc2jglz1jg0\n+o49\r\n=bvXF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGD/ZO7zmSdMMByRn4pwD58t894R2yICciXkAjmeutIkAiA8T1kdpLa8pFXQjMHDkU2ZAkAG4SzyQY40gax8afPnuA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.16_1573416695938_0.7016146569405421"},"_hasShrinkwrap":false},"0.10.10-alpha.17":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.17+79d244d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"79d244dbb739316c960a9eda1cf126f4100c0de9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.17","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ketgN1VWeEI7Km07Zwrbly6imJAHpdUEOA0YGMh+VqtkBsUVkJwicPNoOf27Ln9TJOwIxPMbpLUa+TkMMxSUbQ==","shasum":"bb2679ee373b3033cc1cb2f4dada5494333fdab3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.17.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyG9fCRA9TVsSAnZWagAA0b4P/R1XHv+3iEmhf70IFa04\ndrxor0x2Rfqb1IBJ8gxRHkq5dQdshgz0ARY/uVl4IST7fFICioyt5SNrsbzn\nHjBI1WRS5OXjZbjZPU0t04v6ij4sIVBpHw7tfnqp/JJeSDFpL6CARcIHxIO3\nJ+Rz01FX+3GyyBQnlWQx3VYAK4TU6jAhxdVG+R0PiUcDpJikGeNPdd5bEkST\np6HpR/eD2DGquxhwdpH3/DrBaDujxdzT4Qhr2wTe0CBCFHQxszgXzCh0N4iZ\n064hE609KoslqeBDHQZtyMTCucD16cYvb0Z7QapLlAd14GhWzgYZprG8E3W0\nX7c6N6Ai6mGOUFM6vefM2cX6OD7F6dERuP+IJwW9gFYlmkMjUTSML/iD6Uxx\nikFaqqA8HNviPgLIhETHw/kRhUE9ouJ43nxOZqZgM/35+SMsd9Ig9tYME3fF\nYLkgsY94JI7eQCPYOmnnLSPB+wHp8K3e7ZMpyqsuiHqDVO+ZoQxQ8Z2vu99k\nzrYkQGtLU/gyzHiZ+ks8yU5BOG8pAvK0hWBObCtSKyYWuyglRG0yGqFRTysN\nCaF4zrFqR+xntmtHiLp+n7/I/kAcXIlwc1CHe0hYnYNe03iqZMm3r5zhmIKj\nyg/FA9e8rD+ByXjT+ITXYCm9I5i4keDlhPXzTtrCcllUgAD1UhxoMJiTFvp7\nN+ZF\r\n=JtGk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGCO+Cr7mG6c9xpQAnJvMkyDChhbYntOaEgWev2doQLNAiBimkzFTOW1x0Z3RxixmkdXusI1EZRCehQQe7vXmOqJAg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.17_1573416799256_0.8858356759168666"},"_hasShrinkwrap":false},"0.10.10-alpha.18":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.18+920e69d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"920e69dd73be71ef4156e052801df768f226a4c7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.18","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-jtJzcI6rEh9wHyGF95g/mBtNz9zo7lEsusnH1kzw4THdJNjIux2Ed5ZL1HCsNRnOGgvOsxBFp2yfci0iL2LQ0g==","shasum":"f7cd6ab2fe2698863613873c7297880d19f795c6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.18.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHA4CRA9TVsSAnZWagAAfdIP+QAAsR4NkGGLRN2Yuhbr\nlgQ8pC6g4EVteshLh0cbHT8CsFwZFb8Ea4BKckYwF/eDybCK+CRWg2v3nvdq\nwnQpxHLQHMCSzG8iI/dpdz1gDfjPB/0tYcqWIY6UDgMfeMM7vhSrohVyWViL\nlr9LeUWvfTd8JghxIVsyHMqlUtsb+II0n062Rokpwt9Sz8GeEPO1+aZVOWO/\nwFMxyv7sN3ahGGFdP9NQC3jBiHq3kp2TuwlIE3/dC83B1USN6vhdE9CmiuQO\n7vGDH0A0jjOrYQw7MR3bqNwKv7JCXtwaUOR9ZC4F7qFm2TRI/dYzcNroNe3J\nJWr4KzpA1xYMvMrlrRxfrMSETemnJouRNpYe1PMXs4xD4481HNV5Shyii9mu\nXlYKeBnjL5nZFUxzhowjTJWAVR2f2h2O+XzsGbffwwqmAF+QP9zXoodlD2Tu\nstNN0ktTsrakm5+3XtZ9UUlHhStIz4r4/CXyFVwzooKF+ISEBzR+4uYKzIVP\nmrP4pneSmomv/pzvX2ZzmwuXX0KYEX/8ql72Wtxoxk94YM0rVgu8Xewjau/L\nbqzvrod02rzEVHvTTCXH/lhzYxFImC73yYaIhQ3w7V09wmOPeU2XiThp7tAU\n1XnRy8DI7dZMTS4b0+cO8z6v9LTw6G7zbpj6Ep65fRzhnXdwg2HFXRYIea6s\ndOFp\r\n=2Moe\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC491mdZrWhNj2wW9cVQAO1c8tuKp30N8SHN/Shjpb6FAIhAKGraw1Z2anXsx8ZyIAfYh3WJan1cQYvlrnHWucBnxNm"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.18_1573417016028_0.2648825976893452"},"_hasShrinkwrap":false},"0.10.10-alpha.19":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.19+dd979b5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"dd979b599e2f323e76293bf2acbfd77178a5b7ae","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.19","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-KL/j/0+zviciIu3n8y1LpdCa0P43QErGdGepGM88Qp2tHLG0A/HhyTsm8fOY0cM0iWAmdVEnIrHbqx1q2YCVcA==","shasum":"a39bde8a369c96e72bcb5ea8292e24fb58aaaac1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.19.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHJRCRA9TVsSAnZWagAAV84QAJ1ufKGXEutKHl8Nvc2v\nIa7NZXaaisJcYLo82GBPkp9hiYGUn2HTIbqa55uTPs9SqEk2fWiY/d4659kX\n2nrfinxswBVWKM6NBVe78i8jjm3ecQ3lBVChNGRPNwRwXoUSblDuNqoRYLxO\nCGxIiT4hjhsp8SbADNjyvf3V7sU3ZLo0oJWqIeuH0rKwlqgmm/LgdJmi0m3Y\na/euAsrXuy04cRakXEOoeAe8YuYhUkPvwIJDeF+cf4hhU6TWlTmA3tQqY9vr\ns0xYqdVGHirU6yUUwjA/OBbqk2L+qx49WnPnoLwa8/2u6Ebh82iocBEte75l\nOCSAjFjyAwfhW3xiJ/bomkx8wsuJNFjZDeDddRxeaLf3yIg6g2VhvgTGOdCw\n5S5UtufelGSxZSCN0GqyGyjvHc85YsnE5ZWDXWf49nFP0CSCtIQYWPwEMfe5\nk/z0g57y9ORLqjlOC44X2LVLMCvIRoVRJFNa0Og0l4Rd/UuNFd+Jzvi1Tvct\niAPsEQL/0yEVFEltx2BPsU17DtAlgbxEpYVatZ/VFAxNGpeZTcQ0t55zInlH\nWAi8ptrAhMVUeIEgXUosrlXbanzlTrGKWwyiIVjsMqpzBBXftYbBuZOBx0tb\n5MlTarCrfvzRN7wHqLob5hyXejBUqZO91zvSR/CbdFaN2CUWpE5Ksu3cgdgJ\n1+DI\r\n=XYDp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEwL/r2fg3iYC1rwivDqRcAV2OT3sGnN5/IDO+TdtNAwAiEAnfulL3knbqB/SvfE4tl5t7owP7Bn4AOLmqreD0ySdT4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.19_1573417552920_0.47653559448693383"},"_hasShrinkwrap":false},"0.10.10-alpha.20":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.20+3bd65a6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3bd65a6aa58c74b2fc3ae78116969265fad14e6b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.20","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-zR6UTaC8m04OOh6I2kmzecmzjxUs7uUXruG40+4uH2Ah1UFkpICbOiRapKxi/0x2EvRTK3qCx5+Jc6tqw6ghNQ==","shasum":"62de7008073b3f93b13d90d8cf3e9275df28028a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.20.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHNBCRA9TVsSAnZWagAAcrUP/3MbEkH/C30YV6mTXnjJ\nM4TGNSfDDxsbj7XfMwfsBw4jS1h1m19LB+OXSwJEoKI76EB8gwcVg/EDXr59\nhEGOin6sfgEZHLO7VtdaHEID/5QtY7+IgX0UDjJIze2KygDt48Pk5D5MICxK\nSFuxiI5NmJ75PZOu2AcwwHitQDO7tZRdOV7l7+tVuukVAwTbclhZdUOf/xmp\nKTIQWZI+hUqKSQH5ZPMCc/DroHv4vuSu3VqDPGyGSFBT7+EQiRv1rl0WCwwm\nQpaBWqsJzCEZxGvBcJITDmLbDctPFMmtMQkbpc28GzdjAeDELr9R0aSp5ag6\n5GFHMgO3HA/y+5sSY5SC/bYsJ5/YiqJJAxrH+gQY2Ng8afx9Un0B30aBnf71\n8pJeH7VLDZ/Bc66kJApuX4LzUggqcdxYq6yp2KblxS/Vki1y5SKRIKYPKhe2\nc2m7mY7THMf6QolBd5Q/dp/ImN0yxS2WeImya5DVPcTQvHCsyVk8x2UsWEVk\nFhMX4cEEemYwJHhXU9+Pk0dfUaCmq9xXBFBr9w/5ucKl7Qa5FGUDJehQ5CG8\nXyW/saFJsi0XBMxY1x6XMtmo+64eEkAm6PmlvTSob+aUOJGvfJD1XdZCRwcB\nCbsIjAFAJ1R40ZW1brdTcWYs1fBV+SfEWXXbgJVv/X+oyD9UUN9SINFkEknQ\nnKC8\r\n=0fXg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCzdFpU2quJ2L9lfNnkWX/3uFdZnh+A3hYI2bP1OdTNwQIgeHR6OitVPlIT9XLLjemn+FZvGW6YGXEjiSjAY/gj+mU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.20_1573417793448_0.18870199365090645"},"_hasShrinkwrap":false},"0.10.10-alpha.21":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.21+0dacca3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0dacca33eaa91bf183e58e000d0e192dc645b61b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.21","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-47wHj9QqwiTUTOCesGcOl1NW5dZ3S295tps6q4WZcdXMQyq5oe7avA1foU2n/lvziH/9cHNFFV6XBu6aJw1Mbw==","shasum":"957901bf084eecbc15ba1378541a7c86e2821996","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.21.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHOUCRA9TVsSAnZWagAACMYP/Aw45pG+Fe1tXauUdhqH\nvQXBAWswBNxOrc6hK2puIi7B6e4+jHHJ6c4qcoEByWUaXuh7PN8MreLqkeQu\nBQCn7tvMrXOCCMlPWIRQx/1N/8BPjHxEYeSnx5ckjIIZARBYd0ijtLEwU3hK\nuuZ378nvy7N2+2IhW0fmTXDVDKIcatyQ9mtZB+Gmlh4p2TEACA65FPY4bS3i\ncz+zJj0D/6AwzMLQ1tvUBZAgAWSYVGh3DnJ36mAtAmLLIhItCTAG34NXv8I5\nFIwOKLBGHuWwKshKFmI9PjljhsDx6ScQf2zlLfIcOBSlrBy989ow1MiMC46I\n8PQZTnK82raKRBnIi1VQof+QvqsRpTPNZUBvgCz7eDTx2p1QRce5xnKMrjaz\nJDWUwSUKcR5bMo/KyQ2EUdE2IOFo3qi+aefXsde+z9qp2r2YT1CqwqVlBE9v\nB9sfpCj3HVe8HqBTFk1EuDZbRW2aWYu2liorP4cmk6gzNBOXhamKwloZ5lYB\ni4htXvDjAGNcn3BqzE27ARr48cJ85OpE3xcIWDzffK58GBJiqloTUyL5JFmF\nf1FUeWRw1Wt1/Xi1PMBJFhnbwt0XE20Xulzv6AgkQgnL/cgHLvtn29ab2aH0\nLtmcNxEhKmk+PQCgijhZl+qjDyzlfY7mUyMOzhEQC5CIH5E1d1k2QImXABth\n3hHj\r\n=SMYY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCszkEqohdESqcaLjVpZNGrtAc9yTzHpy2pCLYVqgP+KAIhAMLPyrMmTmueQLWmX2Mt6avSlaE68sZ29hgUFLvjAxKK"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.21_1573417875705_0.7220836907202746"},"_hasShrinkwrap":false},"0.10.10-alpha.22":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.22+c5f2dda"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c5f2dda0a0f3b4e5c0cb1540f5f4cd0fbedecc9c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.22","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GkoTr+vQDhp2ptyBROMupKxkIGAjQ+qy2w8qu+vbcRZ7ZOjUEmasiPsMYTJqlDeJN4oHQJuir5nzgw2Aenfqvg==","shasum":"15a657e21b50f5bd593ba04b0731c22b11d35b8a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.22.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHT2CRA9TVsSAnZWagAALeQP/jDX2aX+k3z/M23+b06W\n3LvPSnvZas4A+JAns6QkavoU4qEpoYxTd1g4I9FmHJidcT66bNROWsJk15+F\nAYggfU9eBV/b77WW5X72LsJRcPgmc/NyvibQ38KJ/Mr+6QkaAwyLCMDVWllS\nfMAcmQmkDyoJX2gFCTKQTu4cLVobyAvTlEiHdA6N39oWH3wo/vxMVCzkAKWX\n1m1GZFywdmmLwMei3KdTYhWX0gzuPVeZqUqOQj6lDoUNAd5tSNmyY4Hs5ysW\nHg1t+DwvuZT11mVStEezYlUWB9pYDbexhyPGZPx6RY/SJ8vCK+UcujquSw/f\nYG+VVh1GOm9IlBjNHwpMJbWIdzpu1FX69FxS7upIpbDoByjh6IjHfczDb2qt\nQhto9RGZM7uz63f3wwJxyiXuhbgYL3Zx1UAQ8IxwlaUNGDig+Lz8KXTE5mUF\n342xKgn6JOopYVpKx91mWNyyT2XBCRKYzmidfFDWFN/h3wPm2PHe5MuyyVkh\n3sPsrnPQYq2OR6YiiUJw062QQP44NRNwDjvtzu/Y61v4bwOs1v1Alxmrgerg\nT6prfVawIHSbMTFvWPMf25XODaCoshQRp3SXPiMmPqBkygP2ZxIb6L9SQJZ3\n4FMNBs8FUMTQm9+xfawrSRqBjG1LRHDIaMKaFCIpnMLjp8QhIID26wUoj99y\nZcKF\r\n=8scc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDEZb4aTeaIRGRdStA99L1WNP9P8R0N6Ye8AdzYOZBiiAIgRcsQSX+bX/yUWPtexKrR7Hut6r+uu4UDKpYuKtaKZGc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.22_1573418230469_0.25608189006593385"},"_hasShrinkwrap":false},"0.10.10-alpha.23":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.23","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.23+b014255"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b0142550e789c22b4c634ff2e9c40d67d093b4b2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.23","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-PetHoFXgFYBb2w3aJgJs0TxmhqVunqRfEimIVwpEmUK5jZolQORLZeaaBsx0liEGq0d0QZ3lD+Bp+BBWtdMqJA==","shasum":"696307ca828b35cdea71a548d4305ce4d983888f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.23.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHVVCRA9TVsSAnZWagAAXnYQAIlqJoo/zAqfXi5VKRjd\ntjwXAUW5xUeXtJ4tOfnFMLguMguZOWsjtLyFB2C7MZkjzE4kBJ8rhP8NsxTI\nN2qbNpies1CF8YaXVOTHBLprO+65fcghZq8tV40ab6KBD7tgKMMK7mQr0BAP\nCheh3gUqKayE1bv1W+kSJY23CxsDD7IbMSLwMQQ1B45h4kzY0vA83EGYl1sf\nVyZLWkxSF2mntsDzF1hX/7MQ9gzi8SwZ39EAyoUYSptQPHYSgjf7GITUrobR\nJL2VCIHmxnHBRZEXf3tTqLNk1Y2/+A/wn5n9R2IgbIIPn+Kw6XRZCSy+jq1k\njowQ1uNYwAAYidvK1SJ87G5bRA0xsHVWqCDHSVG/i1+bnVfzDFO4CVJQqLYK\nWGoNssEmS/UISK9HcpT8cZ7M75Q1H87a+k6c81pEZxWEJ8DrxrJl0Qpdr5gO\ny4HtQTcIIKeJfoGM7sXkAe4KseBmFerjBYdlRnZOKOJ3Pri2e83BRStR58iF\n6Leu4cNKtTIFKQaDUB3ca9VoWlanc89NIp01N/tMIlW/aE8iPXdN12eXbIY5\nQFsXdJPrp8Z6qpvVsr22FM+i+6R/pZw+MjfrNP2gUAQgjrLLdDBDQ2NOh0Fm\nLkRrWz+o0KOL2tPTvyUjxCfR5CnXmYbvL6Mf7Ogfiu1ffk/Z2sMP5lq55qA9\nPtK4\r\n=Gzfp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDjm6NC0hBE0DUIVRbWsP5LhBSXePSL6yNcQceYuUJd/wIgWajyAGRr8Hw/o2sqNmb7i87+37rbP39aLRMLdJx5CKA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.23_1573418325481_0.536205695848003"},"_hasShrinkwrap":false},"0.10.10-alpha.24":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.24","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.24+ceb7f57"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ceb7f5718b0f53a53823612e81c6ca546486d747","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.24","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mgD1KpGMPe+ntTjxUDgwvQqKsXkRTrgrNJS1kc8y14uAKPh/jPb52icjGvm6faQT/dhABG/7l0TcQc9KiPKZEw==","shasum":"6828df8f1a71b85b0ca5251eb5af84bb52e06b4a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.24.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHXdCRA9TVsSAnZWagAAnkoQAI1vA3UPxXnGzcRrvKCm\nKbXgGZfxhXagL2y1KvOxdnCJocZnYKga3RRRflTow8v+qzrInUkug+qd2HdC\njIMum3dRQuHe10Zz0qi6z9GfbmA7aOsgir5seOGt3VU0u7urAt1sX4i4W7gk\n7wGT2hg6/F51pMkQfp3QgpJtIBbJ64PgcUpQXNZ3NT+50rjIcEBOD6neMJv7\ncq/yGYnSf4GemKSpVxEtzPbXyFvMTPA6+f8uU5t/5llb3Z+AKm4hN7PFlMz3\n5LUsmdROFzayW7LJC+kwpGswqQUPobe7KD9BHcWg3U3oq15lbgnT7DwweQvr\n4Putk78TLqMY/cN1G0vhg2TUDs8m7rIo+W85soLRojzsdETrmic8m0cQK2bs\nGzcBmYosA/35G1wOl7VIO1Wis13R0tDnGxg67yNFzXG+FQ3R+ZslbKPc+qqY\na3hr4jnROQ84fBeXdi/BahAhhid4LQJJcdFBiIgdlzg1IZ2OZC9k9r+jH38P\ndf1dwmrlJwg8gqDKPuIPIS36o6vajSXgg8qRfN1trnOa8ooc+s35vo+8xPp7\nw/TuUFnkbP9BHIdGREE2+r9qJOIAl6pxnkKpBYMgcszdfg83pH9MbWzxy3MM\nEjayODtOr7fYO4vV4IkNSv2RJOelIEdfDPMeVr/2Jih3X2c6sguEBGPglc/H\n3eWb\r\n=5b/d\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIF/ExhPuIOTzod8jctkUJdk90dSrjFRKmjyQvtr1acaBAiB7zQKPx321drYUGzpWbsUJeZFv8yMyDWO04qk2LXXDqw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.24_1573418461223_0.4038766510397418"},"_hasShrinkwrap":false},"0.10.10-alpha.25":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.25","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.25+721d54f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"721d54f46cdbf7a876533fa8e584b8d11d6a93d3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.25","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-uEWzaQbEImAt7uEc8E5MD0KUROtOyLT5rvcFPB/5xSdYaCNqhylsuf3Bi3ra1lrUFf9c0tNeWYFKmYvcVf9rtw==","shasum":"5890d15b0e0ba8d935d711363225da0ff7553e95","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.25.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHdECRA9TVsSAnZWagAA2xYQAJ7rx1hmoBogxFKPxHHj\ndHAldgUqI2OrQ6PN9Y1zanPGm+VRO5GZhBA+fdueUOnXs90ja3eK2NOt6Ml9\nqvQFsFZyuZy8KPpxZi6LWtjxC58l1vhd8JkDoDcg85NdTmvzpDmDkebpr0Vr\nJYCl58KxIpUVguPdk7igMo0YQIsX9bAzFYFNlhK6HwOQtfZq+funApIXNDda\nwLOpPAdPewjxJbXHNqzcAPTs9XvoIMr2lUZrzbn/N5UmjyX0xlNLtEkt6drR\nc6iybbAm1dP7YhgVleh0ZmJOHs/p2/uViBDmVDOI13XwrXk8k12m6mTJznJd\nFSpswPIsmgF80LryyUVpmyb9geQu67uhWTqRXcpL/BKfFYBBV+iWAbFK75uL\nflw/ApyTmqQRnn0RnfKTWCE8Mbm9I3dc6+IrhW0ZnK1sV/AiRyUZ/G26VWQQ\nZoqDqcIBF9pOF1muzMMHMuNthv14kEpTKhGJSbdQcHSmW218VsNNYa0CraLe\nHpvJBy8Jdmsk2Et+ntJIuz5zo0/KWJZQBAtgnOfIQCtthLVR/KIqwRkGSv+J\njwmfJBoPy9hfKV6+ow0HO4/k978puQbyDLUJssj7AWiPNuIwGrMI8JGqwVqy\n1tuNMB4WNhC81DRsNhhOYlM0vT6ewZ6HsUZvmfd5FnErrlg2pl+5F7z/aMVJ\nRP40\r\n=xfGM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC8KA0G1tew8kGyGCbMdFd12VWWFbjC0FB/KjYDshMW2AIgcOC8i9cOJMv03QEVjdSymlfy4TCUdZcU9J+UdpVfw7Q="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.25_1573418819990_0.10818434916959685"},"_hasShrinkwrap":false},"0.10.10-alpha.26":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.26","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.26+1f8cb6c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1f8cb6cfcf897fbae197e50c40094b9847fb5fde","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.26","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-arWT8znFwB7X7DThKANmRExWY/9q/5bZKoCNT7awPg3u1vWOdBql2ErzVEC/iSIoat78do8+fAsiBJqC0cnC2g==","shasum":"70ee9e6fd079b6a0e071bee8fc01cde0e6d60316","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.26.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHnuCRA9TVsSAnZWagAAv0AP/2APaSWdp6cUP3ngkvYu\nVAYVT6pU3UuAnk6jy3k/EKdEQ4ANONMVg6CMXiJT9IkOxFnmAd/W9d2D3mIi\nNu7o4iFxREUqsPsSvnCBTwn1LjZxjlu19whXGgnWRggUufOl1ZElEAwV/Nk7\nW/kKBhl/pIJVaPYDN/CeKpgzZSbipBlJZidCACD8CfSDyjY6jWHIRTQ4gQdl\nShO1hPUP1lhIbpHfw2gJBx2mOc0lxxbFdRHpyQZ8gA3e4MIGhQJLHRyMSLOr\n19qMBdWtRq1E7QqRCaFFdTm0r4TnC0eSa0KNS/qNPlC4jTmKCWfLTwe8NHqr\nXq5zYDtb0rP4QOMN0avOP1yryuOSo4i0/vTKq32VEfF5siRtlsdNNozY+Eab\nuMoqdsF4RoibuBcQuj5YOJrHF2BUS+nIORk4BVavo8gAeoGooGIhRB/x2xMz\nnGlNSRfvhaUOD8zTmxANYexWBGnicSQdgza7GgDDlja9TpwplMPX1E9wYmGZ\nFTnSWaQWu6n6gIy3WbOXQL314fTkZjLdPkJT1P8GlC4wt29eOn5rUojN+hmu\nDuQFQQvsLFdtIhojiBwK0NJ8ghtr0jirGTJtaxSWcD+3D2AyHoUz59qHkYDI\nXAvdEZN19K1b/drg9xmA+R9niuOunV5bloILBHLMObnTWfYPeY4ZFtZBwEzH\nr0lo\r\n=Ju4S\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCZuJwjpOZXukN9mp8LOWe3Q5iYJJNVEXJsyH1wzOEaHQIhAKILuEuELy/8g/+sPoJy8luwENdFdFaGZqs2Oqqu0Mev"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.26_1573419501946_0.7494376276095367"},"_hasShrinkwrap":false},"0.10.10-alpha.27":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.27","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.27+4579a22"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4579a22b3b82be0be8573174b136f9d1460a8571","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.27","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Kq3sQC5iNckkM4DpYxTOEtUV7K1zfgKFlDgpm/Y/CcNDKKX2oBUW28gTjJOnb1plbQHPR77bAMgzb+ADI63vbQ==","shasum":"483ffd58cb64ca9bc3adfc9296cbdd81600cf827","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.27.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHpqCRA9TVsSAnZWagAAcqgP/1HOsNoeaHdwX2uU9IMD\nRhUVizSEjvF+szlq5Tor1jZ7caVCcgRXbzYV30RT7JnMfU0YM+OgmFK9Kxuz\nFmv/YY8vBMytuKB5F3aGMhx/BmnkaLQmFl9jHqIwN3BSKMvrdg2wO0Ak3pnf\nSStXkQCUg2FwXhaXoxX6TdzfCFwRKivXQB9fd8N2A7ko8/kAM5MkUAGw+omJ\nvF/E4751fKC8P/yp1kUnhP9o1Mr1AUVMdykOyzQAZvxltVKJEa0hao1CrUw7\niAxkBKTQNNjo5Yxg+dd1lHVkz83wnrKcu4aufQwqmMGtZr3PoTHsEtl++mgZ\ndvDRQuTw1SlV/H6IqIK3dRt2QJoVPUw2aM0i9OPLmMSq1qvN6O8aeF84IpCo\nHJbJQ+Dtj5ZGVtaiK525l9OA47oS7pQZlOw76pkl8yx1qePji84nGqIDHbZ2\nUVyQ3TjbUrjT2CZKbz19zA+ebxrMI0/ee0whaQ8d0mS9dSkHUY/KHl3Hu0R8\n8tVDmMiZ2F56MBgYWkN1IEs53w9ws3Gc8U36WHK+6jY0d7eW0IWhrsDut3V7\n8/zlzxlSEFlQ/bAQFb3mxeJxX9ACmtzdHk1H2rk0gk9662/BDd5EU1kdty+L\nVrdAEF1L4e318OYyB8ou2mxig7dYtm7x/E6cWoizP+K6femUk51xyFixLwsx\nTYLc\r\n=oD0b\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBa5piQ8F33F0/owqDb6KM1O0gV/cRpvT0osPnU2H7XVAiBtWiieJ+fONCm7vgl34X6ASyWu14W3xvobr97v7r0+Ig=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.27_1573419625722_0.2442538702204038"},"_hasShrinkwrap":false},"0.10.10-alpha.29":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.29","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.29+f8dc96c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f8dc96c82127dbdea47b3c853123b46c3f343343","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.29","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JQtM8uC0ycBNL6GUtxvmtLaRno1jJ3Cc9lF7aZ5PtKHlZF8/WsSG1DK03VEw0LstqOYXtmowUnnATwg7DaL1Rw==","shasum":"eee3a3c6e55c5356ade3f4757f3bc4b06dac2e9d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.29.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHtwCRA9TVsSAnZWagAADyQP/ic0MUzTTdC6pzllwmlg\nyr4jTHEYoGd+H7CMN8egE+P0IFuA+POSBFwi3wGJmBT5wj4aFjmTw799vj70\nR+CLqch8WaTLbv7JAyoeRF5r5dXg92JJNJs7KdM3gcTGunlkBk3cpx9QoaJl\nU+pc/22oOjMhZI9TujR/CeNVPJJzc4X6Jx/9O85KRr+pXr7eUwsChGFQKfTU\nB8k/x/PWjDho4/gb7Jv0qzxcxbCqMugETPW/SuzWffaITXmuRYwsG0JMQ3sY\n34Eswb8k8IJaL2kZxwFWL7g4BZv9uBXduS8BdQhEk0Hx1a7rpWw+7UWzJraT\nKa4U99HMTkZ4SzGCw7bXqtMTNHwQvfOSnSIbaNmHKxchX+xucbILSAeFyKwt\n5EKqbztveBH3fift9QgRKOjYA1rqkCst1tDsomyvJIhoB4pCQPTEFfwiw9ul\nXhE0XQ/LWmWUZIB9fPUX7QXObWFG3RZ5Y8fqdSc7Zmukj1o5Tu+dtrINhJ7k\nVMz9ytPdfuggoCRH3blePkYvis8aI8CoZ7lcXbG8efPVWyUz+7CD99b9haTF\n4ri3jSzs426YlPVGy5lwXV6uvrL3auyW4fxZ5gA8++etybIxXVGwrPIWnOXk\nc9VGojyAS6oIJSKIpcRlgmbjXfSXPpT/EMvnKM7xUr35/poU46uw9xJwfRn6\n2VBk\r\n=+PqU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCxoeGnzgMQvi63/H+NvqP7LcMWeEvKOuF/wqXPVrDNkwIgdaSp5HlWRt7KNeV2hud3juuJ7iACn5+RMeN4vOS87LA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.29_1573419887747_0.6753513787535423"},"_hasShrinkwrap":false},"0.10.10-alpha.30":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.30","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.30+acc3873"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"acc3873536452c8ce278e5757a9e5caeb4327d21","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.30","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/Nr7mj39k3BTZgajDhrTZDq7XMpY9wG9cBwbFvFDkasqWjxvygz5wC8aGTd2RZKKHzyHMAJA6JAVpRk4XTAVyg==","shasum":"06cb61ebdee0669403c8518789bc5631d2032068","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.30.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHvACRA9TVsSAnZWagAAEegP/1sz68bNG7zaPg3OL139\nj613KvQw9R67YcRPAYhe08RkEGyc+9d7Hm9nVH46s0vi7G69sRJeN2+9Gzx9\n8ivRd/aRlzWKnXZn/9ZoeQx+yzv19BY9eZ/fFkzBENYJXANdStTTZE1nIXN5\nsihqGmgVB9OMf492ONiPisW5juULPLEQvIUXRASKA9dMeFjpzuEs+1wreGJR\n1wF06X19eYXCLZSsIPdkV9YH8viJsxaRg3HHVY3J+rmQocQ17SX/wPiBOKbY\nlVQTxoM2uYhOkgLnBY0rxnFEoOdGl/zI9tdpERiredLDZ8Ll4iLTcOz6eyXc\nvbrgb7LAWDsflYZTM1/u6b4DkY01CGjEK0Y1AI+XxE2wsAtemqbXFPIzeQqk\nOOeGvVf4uyyKW2U4PF9KPd8ZO6GC4GyYsZZ5GRaDQSmo5W+Sv1arWj9sxVk5\nwa+APclcfYONdZYY8OtRhLqegd+12w2uFC64GcZGmz2LAXFtVHfnRi4tvdUm\nJCtQs7muBO89hzWsCXbVnceUOHKcg1rvgTA38KBiOJm+VIpWkpJIRTcXD0BN\ntPMd3t4KRarkPH2wpx8WrhrULNfVfFRsTjHD7eTpCgO8huH61zMg5RMLSCca\n4UArCe2+ksnbBOAOlXp4HaGQ/6ie+0M5vq5NFke+4Sok/saJoPPZhh7bBmQA\nQ8Iw\r\n=ofX1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDb/DXM+de2JtukHo+wcsUdfmGpM2eL3IcvqRzS4hxR/AiBplG7F/BtFLvGQiDV2MOysWumkWJAYOcmyseuBQQKQRg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.30_1573419967773_0.6003228590829637"},"_hasShrinkwrap":false},"0.10.10-alpha.31":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.31","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.31+925d1e9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"925d1e93bd39f90d7436ee419ce428572c8716d7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.31","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-dYm5t81Tks9S/kWWPP70K5bzR+0DG9uUZ9WkEkakuZZtnLlnNzL7xcUegQNdu8If+wjJhNNz+Fr8IVLI+JlljA==","shasum":"329fdcfc58632d91458c819f4e18413a5b44c0ab","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.31.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHw+CRA9TVsSAnZWagAAAboP/Rv4mOAyqLQ20mcxZ/Z6\nkkV3qdyx8Hk1MnoGxuquzazZM9OXU/IWki+Bi8er4tNtey1+eQakB5jrEXNm\nwR/vb+VxWgiBTUecY6Q++5zGAE1XHx8YMcZ8LRk6XOIJB++W674TKeZD7a93\nBLSDSuSi24a2QNpAXy5Bg2CCWMsu2D2F9oWI+sBaowiXCtsAfdL4rgVqmoqI\nSttBlBmr6spKuLr9g78Ola2JA2Wb2gV0zO5l57obV+l4IRhdwVBZy294dHEG\nRbzkHmFTJEOJT25nhVZ7olo5FACZTHZYqSwjzrcdmd7SHNISgN7vTQArXp7d\n6NBTE2qeTp7ER7qPMJuOT9FDYi4W9Dyf7TRkstMRewBp6gDQREqqgrbXvLOu\n2FhUSGyrkal/XNoOqDeT5kaOaG0BSGv8IapU3ZKUVL1CX+ayOzTfFoQEB3+r\nDifzTZNrDBowSbpQTR/AmkWBkhx0iqnExBvUdxENOMIvnhstlzo50NbneQud\nEVn5mZwpOTBCrFX53oPbTStlLTBlSnnGoCCNRCGBgEek2g5H9c2bhQSL6OD5\nCadSO6rsbgkELiOJF26s5mj9jNV+r6++WUpZbrYdLi+O9asfOeCWWP/2pHsv\nW9R5KUVpVelb8cUjz8BjY7xhSiSuNs3UEq34TP9FN900tuH5E1nWWTX+hMjH\npv2l\r\n=aJD4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCHxwNz4ktKr/hQogrdEgAGCs5dJ8nli2vq3aSN6k/hVACIQDFmPvFyJ8vaBlFAqTki2IYNOb3AzV9kjSCkLQjRna9Zg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.31_1573420093671_0.46523670780638815"},"_hasShrinkwrap":false},"0.10.10-alpha.32":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.32","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.32+dc29432"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"dc2943233feccdebfea527a6e6273a0a9002f8a1","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.32","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-a1tgARGmlduoi11qqvD/h2/Md9TDLSJa6qMyuCFvbKJVGGDL4FZVhdXso1s20NO43MQLbsRggTo0hICygHGxLw==","shasum":"d1097b2fc07484a5c84a8e2b9d4c8caa5bf28421","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.32.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHxtCRA9TVsSAnZWagAA3MMP/1iIRyPMz7BKuRnp6eee\nT9yu9oE8CR1S/KNMiKy+WNi3jKo77wec58CinMS4XLK2ffNEeFYNgAXLa6jf\n9GPHr3CBAZxlubb88UoPG1m6JFT2/oP7OOC6HrptHpsTU03zqSBoR2PP9S/1\nVI8Q/6vlzkAGVSsj8NL2WFVEGEU/nROJWwzBDrYmjapK00738TEqtZT4N7Hh\nd3wyesJqQDU7Z7dqUCFThnZBIXGIfwaAtKBi93FiuDAQlPscl02nE/1vv5HP\npxzZVOlNxNJ1Ilv844gH7qXcvJxvxE8oHDFToTjnOLP3qkXx+MZqmgqV5YsS\nfn+vRDEylSeDLktAmbjDrtDb6ckDkzktlKAnjJuDu3ZMBENswGH76TeelGLl\nZ11jPETAWWnUuBdX6Y/NhDyrTTSlnoTT4/GqP+JLWWKeLUhndHYr7Y0euy0e\n7sEmIsXb6bluT0quZJHhMiePrRV4j1xFJZo0M5dGOKz422TevUbjHCHPDing\nNl25Dq4uuYwzQIIsxX8euoi1uHFAv1lp2a6Ld8yaXxV5oeXIKho1UEQYyZBl\nQvJIA5H1Fs6YLJIepzy884zrMEGbXOn/vJ1/ymhZmKM23kwl2sTG+tlDZ+Dr\nVHzFcIIbjpabK208UGvwh+QawPyvSmUgXqTVa4L3G/4QM5543yOK73V1e3uJ\nxuk6\r\n=neSc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBdtHkZX7ZlmvKgTPkrsCdU/WqnpvKbt2rUhKCJaz0UlAiAfAjQ4lYFlzW3r6te3d4IOb3MNh0P/Shit7taFIsMymg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.32_1573420140737_0.5933122553113475"},"_hasShrinkwrap":false},"0.10.10-alpha.33":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.33","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.33+39390b5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"39390b5abf572447635ad320a055df308b06b10e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.33","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-KWbMe8LLYaB52VurWWMv5vpZVOugCbnqFXy65ahrJRWEwoDlXPw3+KbcAlUawQH59HTtJ3Qz15Pt7oQpEWW+pg==","shasum":"c114230446847670a0cb156956b043ae1623ff99","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.33.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyHzlCRA9TVsSAnZWagAALUcQAIHoDH3KzAqlwMbgmAJM\n3OeS0mc1XbWJlvuDi7pvs7ZigRwEHi8wrFkWhR75QK+Aie7oe/ugfp7yiReb\nI7URpW11ShrPEdGHQ9Zh3yUYX608mFJ5TRAIdgitDBXBaVk/8EF1P/FzITA/\nGdDz0Vos+mHf69a/6Bdo0R5gcfHroH3Hl4l+5lzwCZs4utFPHDcWSqjrUgMB\nn3GhJW6czzDy8wgJoMo2pqPDP8pcRsW24I1KEK2vTnq4Ca2/GXSqCMP9WeLh\niBPI8O7eHnnWTG5RsGrBz95olswj0yJZMXUrWm7cXH1HMYprfQNYcj0OnatU\njtyy8BPTLuDT68VUwLBpPS8qgt9sEzI+h52+2e4Th8LEV7JFNE4Y/shEfLDO\nqkwlOI0EcjM2ln2f20rqEOd/6FpXpZQLROHQZZpGM6Hkink2/aZme/ssUUc4\nqJyv/EQfddQeETbvNQR6jk9zJdHmYl7VUngMNnTmR2b2c19MXeMHLVNywXy8\ncpyMETX1/qEGOafLRPcr/FMIrpe9FDDx4OmHnWGQIFPJe2S+/fr0L+d+bggW\no2d2kGsPgyeASzo69p2ge1PHJT/1JWj0ouTFqoZK7AjWigElRelR3x0bdcaR\ncG++ib8FLmTdMwsmMSH0SwB5FNFDlEd2+P/BxCtgT0aswWpKnoSDDf+HgnVM\nltsK\r\n=2/oQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAioanVSg5yEp8ZlnQIdNc87kwTUiiFb9PwG8mboGySlAiEA4wTNMmds47tdiyf4C29qtGpF8y6NOge3yRiyJXaVS60="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.33_1573420261155_0.16300163649306154"},"_hasShrinkwrap":false},"0.10.10-alpha.34":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.34","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.34+62088f1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"62088f104b507c729a44b396d185e1c3edfe8294","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.34","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-aKGAuqx1Wtu20QtT2e1t/kS/CLSGHUU21TGvtMm6wu3YT6fDywlnduDO3Rw8Ds0WNDep3XPPTt7IFFyOXJnatw==","shasum":"3246a36baec75fab1328c497a215f2db28a90c85","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.34.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyH05CRA9TVsSAnZWagAAHjsQAI93rn+pCwD1cvOGni3w\n62vyMzk3ENbjtosToG6aXGzCthie7chBvRKDVW/fi5Sz6HmmDoN44Bfa9vD+\niTu6V1TncPIEgTxFWldmCBiFOEoQrgI0bS6i0KMKWZveO7+Km1UtuzcU0NWo\n2WqEJva3dieGugrWkTcYFs4LriJOh2Hp4fKHCh08O7R0k0RKuj3ukRMBsE8w\nY4TO3LxXK7hHzV83/dxx3Y8RZRI09GA1CMo79+9b1aPtV+S2VuckMpNB+4km\nnLjVx58ClpiMR/LnVKv3c5Uzi9mBdJhFGMmRZmVfP5w4WtBiPt6GbX4Zoqut\nOUzh56u3lXrSHPNPiRdXgiNmP7Oceo3rX5C+XQArIYffXHZfcaxMVZVFGshb\ngpcTRZS4gN1yqXg2joaboJo9oT7UI079wd6jwth8EBBrAKOtZkGdHq56DC+m\nnUrIFWb+8spsvB1Teoxmkw0XtHd0Jyd+0TXHMs9uC+MEm18jmDpyp5rbw9qU\npvfVE+2b3Y0QIYsBacHADISJGndEPpVt6UQT/eb7w/PZ8jN9i4sLcHg1DxW/\ndbirHPJZtv+xo29shStOQFgQlR6s9JwS3ZYVZCMysbGWaYOm3cc6uc80ic72\nVdlpgioZQYaAQlZ0atUoh5f+2GWprMFbmY4pNUyieiCALXyAGP9zTYEKGTKv\nbxd6\r\n=UGWm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCm3dDHnhU8B7DPG4qmAzFDkgGFk42NXALKZlmBv76C/wIgB/KVXWonRhrrYBY4PDkDgMhKO8qVuPjvHKRh0KF3D1A="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.34_1573420345488_0.2683934025637713"},"_hasShrinkwrap":false},"0.10.10-alpha.35":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.35","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.35+0c01161"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0c011612d17c11dc36d93da602bae33ca3b2c484","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.35","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-m2MpoQOl8ptuSFw7uvkWKU0APbrjjRaZL8DbWnVjcE4bc5C187QohV5g1PAJxh8JSgPxhXN7hMX1mSwCk/qAlw==","shasum":"24acdfae47cba5ffdb92656d0159bb32404a07d2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.35.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyH+zCRA9TVsSAnZWagAAqFUQAJrOGblwVARBcq3N9gJe\ni31MUvJv+wTk0wBEUruOy8vg6WDUIbEVPnuPlLvnz2V7QN8A11bewfcKL2pt\nzyWAHzg++/LOrvkLqHF2i2h0XAl+ecPAmyr2i1L7WdZbxFczCaI+XDMJD+2H\nt/8ZZyltp84JXRazTrDKLgzSVlSh2Vlr0fJMFzMpku8WE1wwT1P2SYTceI/u\n65m0VV1fv8zIxReiJROm5OwLMqUwK6UzsJuq8EY1vnpvBkZhGgUSYhcf+6wZ\nYixJv+YIOWPO1mOhEZzWehAr4AdZBBIRy8kYeIKKrlPx6cFSifTRBjf5lZSk\nmhIDakQDVIXBYjJbxBHIwfzFDUviU7ZpnmD5iHIU2Rz4ZG7JqRBnBb4I7KMS\neI8vyaNfJ+EN0XK5OCJzeyf67yKUU5EvxAxSQquQex0gosB5lM1jDY902ND1\nuoQIj4tvcty8HBpLaN3I87K4Bd1og7gZoxgxjM7zQhPruRn+c5wrHK7ffJ3h\nKzn2NEOopYyQLTTj6IJspPNrlNlYHBhpcAwcuBLp847/pTNIeTsf69yU4kDg\nsYTRM8s0JhVOQDm7pbRiVoVi063xMU0FTXNTXouOP7z2oSm6c+nzZ4nV+odX\n+BqykP0vW5HYcSjCYHmEo9GGYZQjJdCglwwyBeWhCaf9IEsTRITvPpthiM1I\nHzEI\r\n=g/O4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD5FdXuJMtZ9xiIQmR7Nl6fA1mns/xzeeyL0mz7RXbnAgIhAN/Tbq3DJoHPqi1yi2/JgwUkS6OoMRp05lKQsRoKfrHm"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.35_1573420979149_0.00916484237340609"},"_hasShrinkwrap":false},"0.10.10-alpha.36":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.36","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.36+059ca77"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"059ca77d60c3362b476154a733c7c4e679a8bb17","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.36","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-YtOW/aFHBt+QHXM/RmUh9btB7hzciZW85nJWFo0DA+svEPoA8dV2oNN+Xc4HcKnYr7dT1Yck0SLCdZiZr23OTg==","shasum":"c201f787ee200d6cd516ce0510a48249d4b44190","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.36.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyIJCCRA9TVsSAnZWagAAFzIQAJtuGLy6/YnOURgLdb1o\nnEzJdnzWda0oh7kOO5aBocIOsdO9TyijSbhZfO0GE/tShaDuWgkMtJ4yDAjV\nbCiMFz6SAuc1XrY4PNn+yataLouRVI+Wwbb0Oakr1AF+p53iyZzGB3smTWmk\n7P3T+VcOBgV1w3D6PsxiNRY4SzgL7bhJh4lhrAj60xZR4VXv4OGZFYOTOkZA\n2k1a2ddNuMuZ7vx/huC+8Yc6HHngBZvG1T3+G4N2iGQvAcE/NIzHLGIdnEjc\n18rNWejWxRiMMDZixUAWonzMoA/Hq/nadHEZAc6vdgkOsP7whI83jj+xGv2Q\nngX/Cshm9ZlMq6WpjoAHlNKi2oyukbYQFJTiA4Xe+mtuwGz0JxRFnQTeLyon\nEL4h2oeLqNNnIpDEb+Alyu86UILQO2JEQUoVJ/L6RTsul85NUisz+Vi5I8y3\n/vTHn5E7qJYg7aJJQvVX0tnGQo9A1lVE0Z2Ixhd1eLBaHWjo2F6zQXgkNKx8\nhPkYIrkTu9k3Osq7g9I5zAv4D6AHQap1wHPKZl7VWz2GM5A9ZA4PeCx/oeiJ\n7MjXcd9qa+8bczMkmI2wOX76CokfHB7qjTEqRta+n6EyeGUfYbskUiawVGPg\nb5MRizYg6cVsumjIXS6wZhexj9D98/uDGuEcZ83KS2VemZuTqXMLbhx0smlb\nOXjj\r\n=U+IA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFa31DDB54YwbTsN8fcI7KlGdAMO8Iuab+6w/xXS2MZJAiBdCVJF1m21tcK9nwTI+fdm6xwlhecXBCiAoYtuwneWOA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.36_1573421633776_0.4458483929489099"},"_hasShrinkwrap":false},"0.10.10-alpha.37":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.37","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.37+bd5cc79"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"bd5cc795dd62bab690f28daed41c7703311bc48a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.37","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GfB6cKKtSGvs+cq1GoYXXwq2yVCI7wvaBGx2HmSo7xsal+uUXXq8YqxZ0DlZxre8TVDCN36t9118kmAVHA+YaA==","shasum":"c79eb4217f7b4462065cc03c1991e1c628f20e80","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.37.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyIPfCRA9TVsSAnZWagAAQyYQAIXGXcqC93bxtFumTLK+\nFZpMCcfSwIkRNwLKMoa9qYHgIBNikB49yzGUsqD5KNr0DKN6GGBpeAVHUmro\nTVrOpue/chhaQf/H0Q7CbUjHYQ+m6ZOM79CPhVgeKH7LWUz0gsut/NZZRIdx\nQQHUkGmdUax29lEAKaC0wrm8iTT8uBwJCbrvBcdevK/NRvH92xUJUVJBFOpG\nYSlXKWbd+YJYFg7ZExUxyFdrCvgwlLODdwgtZqmDyqJK6RW/uwEVPLY9Rid3\nFRnUQxhtt2nAMhbOpcSeCMjXsEPAlxgrLXWdlQ1bDXvXPgMHwPftLrqnmKsa\nmFOUIAl+HLZGgT1aWKMQQcw8FvIzemMB8LPSbd0S6QYJ2+Bro/c89AV805HX\nZ2cpL9lW+eINB0U25IMYqSRnn417isQ3mgDkYRTr3wLwSNqxamtcdCIyzqtv\n60cMwhBfPPZKBkKCgwe/6Ge7J/r6HyHyFemX2nbzF/mgbqRbVTjlZiKnvPyZ\ndGEMQYcX0E4UDb7wUpP7IBETziZPO3dWh8IGUgTT3BpejROQpIJwcnnHLTKK\nVVHpHlaovn6TuhFr4znT10j2SEI7W56QnwCkETAK7XZCPIycEbRuVMM1+5q4\nxHpsgghNaAphb0x8MwRFKoGuU4IXPIyYpIhfL4EcJUQyjYFWOSxZpTHSFD6T\nwgXk\r\n=HtdM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBHeQi5buyeiAre/bNVW5kTJokikgNOJfrRZz4RvCTKnAiA5G6ikufmkX4lEafpvcCtT/km44rvy22lv/eAjCIptKA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.37_1573422046800_0.6849663777030683"},"_hasShrinkwrap":false},"0.10.10-alpha.38":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.38","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.38+de1ca8c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"de1ca8c5342480077de0bc8b054b631403daffb0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.38","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-wAAqPnVlAAyezPW27SE/K12jiXJnb1eIm9yIdrUVV+1Ju2/Fj0Xr0UGOJlubE2gx8AkS8Myq3YQHg83rIjbkmw==","shasum":"e5461737feb04726f6188bad66206588d0b240a0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.38.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyIagCRA9TVsSAnZWagAAsxQP/3Ldc2ulDbV/wT0wRS3e\nkwm5h3tEriNgu7C58D9tc/cHkypetUuQxg0mwwz7lR4l33DleqHi6xKZqTJk\n34enKuVhVtLTKUwPVPCQe3J4gwNgH8zfiQs+ZD3pq5GS3PcgKzyRsoGBcQI8\ndDRzXuREe/JKOASUMGSArZTkRAdBuOPA1SGJGeAKarhgjxAV/Nfty7SibFGe\nEPRTjOu6E5sx7fivvmqg0eS0rhyad2aI3b+AI0mOO+QLFBVtAjK7ODeu73Ct\ntiyDc3zxI1VAJ+hDuUdl11K30cAG0JqRuGmVX7ZXFOWVf9+DQPtSQs+s+JxF\ntP0D9xvVusb4cdInx6lkeI0yIcqRuOb95P5AXG4h4LAr3HqC2oYab09y8xk4\nyfgMpVI0zJXJQWRiyPklXpEJRCWOIy7Yj7t/Hw8yG7nGoDCISO5SGcvvTbWV\nFZuO8N8Pm9fHZSN/AdYNcx2D/M4wQ9dnh9aPpIj9FsjQm0tYzNvY5yQttJZj\nPqgE/2vUwRofnFFGdFSw8JS0wVF3hJyu31bdaH8xSQfHVVl2kgYJLgNmxxcR\n3sqFQ4lzDJlffgDXLZYilXQs4PcojTuzKygpj/O0WeoTbwx2MSFO6u3v9i+H\ncULKdGqvNvfcRV5xyqm61PUgQt9Ab+flbCcd8PX84ofHrcjab4oqfA+qO1n3\niTwY\r\n=Jcos\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEs7Nd3pJUakx6sBlvQXcy7DPRQ5YaMTMHdH0ie5q/PoAiEAnYAuSclc4i+BOtwREQiK5/xTgSvTyAWgHyx4r8pcA9U="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.38_1573422752012_0.8497791609103016"},"_hasShrinkwrap":false},"0.10.10-alpha.39":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.39","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.39+cd79fd7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cd79fd726fd94e42802778a8b7e58217373045ce","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.39","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-51HVwMGzfQ1NdcippVLAn1CXNJZLYZHJmVqMe5FAqzDcB9rpummWWvlu2eGHuPQDW/J1vAQMIJEq/o/YwbIUIQ==","shasum":"aec92bf78ead3c004f6a0ebbd8a23a6a7c2fab08","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.39.tgz","fileCount":8,"unpackedSize":13636,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyIdpCRA9TVsSAnZWagAAQ6oP+wagaIUCJTyDUYhy7p+A\nzTI9ZiZ35PqP+yHZeV26tXKV/+ifX8Dcu99+030MxpkDH8R3N59NIqsW2RMR\nmHY2Te0OdpLv8zzuv0TrhzmQBrNqB3mJuY1OD8k7TP1hhguNp7YwBBoO4CCg\nypvl62QPmlDHDnyP5lQa3pGy9vEG14Xy6XjDWp0ycdRbbEji526fuYr4oaSH\nJRcUXzVEx18sg9ffpAzefV5zwXyg9+rhRZrYO0glys30R2l4huzqVzozagMi\nr89ay64GsKMqS3ucT7JX5kRMShHSyZ1tHfdUZu89jgn6wzybfw1Ud4kU549M\n1FREj3A4wl0lZaGGDymov+FcWp9mjihkq0gj0Xii6svaQ9mhgHikcUjDC68f\nQKXvjNX8XZpUzKo6NUnKMS/5L5ZlfqOiYUM8Dz3V8b/zQyVL0oaorjxzQwNb\n5/ggReHdz3c1hWFIHdIzh8xzsW6R2J5uAiqu3dLIf+gGRDXIAEmT4L1Ah12S\n+Zrywxnc3NIshGKdJso6Je837xi36IIvLN5Nm5ZF91LpR87U0MS2wFvqOu8Y\n0zutsWnWPlZgthH+H6wc/ZqiT/hMVAQ99h1GIc5uRMEBlA0B49bMz8AvX9O9\nxYZALjsW+8oVE0Z26kSzu3Dao97OfnPtDpDbxYWxnc8IS0fz/T9BOGQ+u6eh\nj5Qr\r\n=XM7J\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCzW6tLTTnX9kcIZ5LWOeHwCOlQ5Mc4wMpjaFPel3xCfwIhAJ8OvfR7LWvtFGXFFZuA5Zib4SFoXPEfhAJt4c8+mCo0"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.39_1573422953074_0.9205275302076044"},"_hasShrinkwrap":false},"0.10.10-alpha.40":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.40","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.40+9bf5814"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9bf5814aa34ebd14029322659d2fa79059356687","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.40","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-toJtcuBejsAtQE4ema1VXy5W24v67sojv0IBRz6YP0km3S/Bd0eDiQySYB7pA9n/z45Gq6jBGPMJQ7gbgDV0fw==","shasum":"13772c07d14937e1ed26f2d91597d4df065400f0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.40.tgz","fileCount":8,"unpackedSize":13746,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyNqFCRA9TVsSAnZWagAAuKAP/jfk10MvUCbx+JJQqqc2\nm907cY4HelB6KDO4q1R4f6vdjtbcnpb128SqXyY14ekLGO2URLQwh1irV750\nYeEQhwieXFtt5k9A1S2H6eFRS15HzZ/WhaqOA/rk2yL/ryNW7eheKHInityP\nfvtKueOLQwypVe0RF22+QljkzikteumyXqS9GULKguJaKYLCHc30aPHZZeje\nKqV5wd2capFHykNr+EhERm+T0qRU06jTr322vaseW8VSkxJUO4YWw9FvBdzP\n0h0WDafyx9d/7U+syNO0w8lDsFo+orJOXO0x7NOl5I42Jwa6lawl9Du+LZqb\nGtjGNDjC+kMaIRUfKFbrL+3ACcKh8z6lhc4noDtFZOcZH0OJ7lmmD3T/jcrB\nzp59ksB98lY2lhQesXgUoA339NeX8CplVZab5hkSK89n3uzWKN/VBThg51GQ\nQe8T/lgW/RHsCqkrrTWoF+AG7rUJKsJBFX+41geFZ3AAPhr3sqO8hIT9ch52\nMw6pBh0M0K4HkO91NwZsYIxQU1nYLUc5x2ZvKfsei7eM4b7Gua0RmSTtAXYP\nNEDvREtSRcTdAB4i1MqnciWRUiIBYMw51u9i5TvCAzpxo8tGtK88Nc0yt6ul\ndlfj58Hfp99e/EmzP7UiRSX3V82FdgNelomTYcNjpqlBwaczLE8voUaHB2cK\nIN6B\r\n=/aKh\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCpmpa/SsfjY/hcvu3IRNv82+w8bEfC/x1CN8vCr8ANMQIgZrYtqyZ0yq8QkA6/vrENV7duHJRQJnB1kpFoKT01hYo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.40_1573444229172_0.0898197245778587"},"_hasShrinkwrap":false},"0.10.10-alpha.41":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.41","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7f5be5ec3cce25c608ada2b4044be016d9e28470","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.41","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-T3YpXa339IxpME9IBR5dWY3wwrsW2jqWgUs1mKRalbRwYv3NPhcnUReU+wKWy6IQoAJ5t+v9C6a+W0dH9dGoxQ==","shasum":"f4fab9409ca9eff94c3bc9b34d4d32b05c62a33a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.41.tgz","fileCount":8,"unpackedSize":13785,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyNwiCRA9TVsSAnZWagAAGZ4P/1HjZKQAFNfB0Vrd3rS1\nSzBgvjoVSuNoaRqRVd1Rdx1pXQ3N7bIU5HJjh14FVpBY0cfA1fgPOlKV03Rx\nt2wEulSL7fGoL7JlL0H/HnZQBXYFsezSwPk9UXEm5gy8wXKqfVFFexi7gZBq\ndKFa/+EvmXNoY9xlzcxN3sSpXzQaogKElAwCqkE6gK9+NnOcUItai39pjkUX\n5vQ5LNsauVu63XFCygNkj3roxwYYYTS+wc7/vC8gtjuug7+lqMC7B4eIWuzh\nXZ7woivcW0uxLLeNIDHO67Z+7Mb7Roe4UhzksZoC183fxen5ov6K8i/Q6g8b\nf1EBuY8SWDUrBrH5YWztkkTtE6ZpprTqJdESnoeYupn/AwuezYla0lIlqXJe\ngfsLt9JButP/bu1lzRTTSRYExJanmQXP8mg5qFR7Vj9pFyWFGrza6Z3iD08y\njJFKr3AeOljdsumfqCgSbhpog3cjcM17HEhL/1UAxI7Mah2bRKg52JPipfyn\ne/Wqok6ySf8+IEzFzlXEpQtyHecHllT1/nvevd6Lk+4ZSoHvuzTWFKfpHQQQ\nwgwJFJudRO2dH/QY9MgX6ij6/KZCPzzPOn6ObVnzAWiDzXsuem1Z3rKEkkjI\nVSYkm5RIXsyjrBjSpfafSJ62U7DTL9SWTxdP5Fyf1tVI2PbrJoLlXY4sy8JA\nOVHi\r\n=qz2Z\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEyC5TzR9/mskpNXvaXjpMEVwY/CuRmPxBQGnTwpbTH0AiBkXRHTGb0OQ37gc5W4JllaLrwj6mdbBGi6Co2slNblIA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.41_1573444642253_0.05719588842812384"},"_hasShrinkwrap":false},"0.10.10-alpha.42":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.42","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"11179f39e8111d27fa0b43f8ce2cb47616900984","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.42","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/WTsDefCHG0pGdzK73VCuIzBv09HQxiyRTw9OIYaO+ULvf3XC/fcuXbGyLDZWsFyshKlIq8Dvaxd9VDim33F0g==","shasum":"ccd2b6ec45afabfd93c08a0a0bab880310d6b985","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.42.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyNzQCRA9TVsSAnZWagAA0BcP/jgYd5t+jDDmn4EC4nO9\nI+3GVvZSJstDGZI5yKwrHcnWUENnh6OiKXFioV7LLtRKMGdHYR0I2XXFbWXh\nFDsBperawpjTaO2Rb4/c/PhL8Nc3uG9OLDLkgoVx/RyF6ttojkieWyspf65b\nJJf2VEgJQd3E6JihQhe1XNsAN3y5oUjaWsXvKVGxFNuNWhL3H9gd0vsfqWrh\ntrnUR6dJ2zoVruejoNWWUPOJ0PkRHz6ng1LKJcgLtPB29r3ZjVuQTGInTa67\nDmBhZdHMAzh1Vwd5lZVSHF6yJ9m2bPZr37/3u6epyj2XMJU0TPH3nb7/ckW9\n6D4n8bIjbeSk2OmmN74OTMFRE1BX2Ze5sd2EJyt9k3HcGDyOrjAJn6hcw9jq\nLov0Eak/l5ugigQNPCZzMdF0OopnVMloWjf5GMxII6YGVYkAq/8i15t4KG8i\n2pWhGC7pERhMP6iszYN7JFbY2d3pQqBjis6bJdvS8JcaMGhCxv6YQ8hpUCtJ\nuGP3m5L9I0XTyVLhMO7QBCJfTqpZcb1B4YL2wvbp4yXNILS9pOPuuk6jkkD0\nD/jq4XSj+NShhHP0+R5Oy281r9C0ZsHtwvJxnLxTInKXE52raJ5uBlpK+Gar\nwslwp4HTDeyttHhKZMwFKvN/+SHr7upPzxWBPuaY79SeQ9yM0R9flP4t+g8I\n1P3u\r\n=VS8Q\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDDzIbzFGWvMYN6O+PvX9jSbyvzPHZ3F47n00BX+ZNLRAIgOMxgTOPmcolxQAqSFyXwea3PnkLfLDVNfZW6I4npM4M="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.42_1573444815966_0.13344968693581416"},"_hasShrinkwrap":false},"0.10.10-alpha.43":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.43","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5f007b0f4eea042ce397ff9b79960dfb9dfdd56a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.43","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-tWLaxIks2h9KchrinC0qUv0QDwgXs5sLHjFi4JOiOk0C363JzCvQ2g98e2ZajHSI4yk7fo6eYQ3y9ViroQ8v7A==","shasum":"30f267bfdcbd25069ce8ab01af8c883168938dcf","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.43.tgz","fileCount":8,"unpackedSize":13888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyN0QCRA9TVsSAnZWagAA4NYP/1jGRJXMGj5rscfMV+KA\nXd1s47Sz2Q0hGS89Ek5rJaZIe/JGM1Gho/aAlNL5gtHtZYvZNEZBjLH1+L09\n3c0bjDvYyUtTmuSJ9lfgxGeD+0cr0Hx4aVge51f8uIJYu1Ih/WENsL2UAl8r\nkTu29KO4/oWR/6Slho6wN3FyjkPQJbYF6otjvjgAPfYZZ6iH1mA9Pz1xkhFF\nPlcqJ+PLb66dAwEvU2EzEFG7Fz3TqC2SCYO2TXMvPVUEuD/OA+vOSPVdHoEL\noVrEYzkvbNlX89M95FViwwY+PNKxhhI/z9YLThPx2EnIpMeFgD5oFqD0Bx85\nAZsMEFdblRe1rdB7CA56XpcDevYbQpqh4Tw73yoX8zwuwyDVwmOlHcNj2y4c\n7i9Q4m/ncaUzbhigBNuGNYlSGc8Xu3qEbcC+G6q3vFTZww0O5Y7GB+DRs0WF\njeaoFgIHKY+FvAC3xboBnALKpcRz6RJ3p/wAdtHOKM9N9nuyLW2tM3ijWkPC\nGvr/iX/RVkGKrWk8qzW14jUIXoiPgZHLVjxNjCVho+TVDW7ovTaBHYQZToTN\nGKtyqH9onpSO/oL2XKuqrmg39drkeDlVqNaETBimAUFa+if3PLJbrn90TZaX\ntttLMKaI8Q40IEDft7nXZjfbK42aoe7Qmsda97OlBbO8T0bVR1Cy30XtXeso\nqMAK\r\n=aY6i\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIH2ZvJ1ZCbIWHYrNw6MHxh96IFiMB4qdNwloXPHlHWlvAiAUn9gOMde85fRoHf4MdGcCJ3N7cIhzskAEi4rlR+9B1g=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.43_1573444880432_0.5285622676339583"},"_hasShrinkwrap":false},"0.10.10-alpha.44":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.44","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.44+6ed0e35"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6ed0e3500ebcb0b9ae3c4d61bdc8b2c2df904266","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.44","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Rbdr27s0PsdzWgKbRPx16xfBMdpv4LRDuVeb/9e9F6GMORVq/nHdUksEt9UeF/bYzJNScUDH+n7zwib4h/kQ8Q==","shasum":"7acc2aaad0a31a4df7a8f0ba0e492030e715f999","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.44.tgz","fileCount":8,"unpackedSize":13906,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyN5WCRA9TVsSAnZWagAA6KUP/Rc59BwBLCjd05x6KNaN\nJe14zYDbipc6CD54dinhB3XJt3rcOd8WpLdjg2pDZRE6eho6J9ytIxIr1M7b\nOCaRSDArB/CojQIxF/1al40MvMpg31xoCP7bZ1ZzBEo3937F9P74S2EoG7ED\nBQOjf1ibp972Iyj+Yx7FKeaC3XKCI+OXUMkubZndwTKoEdedOv0GlYnCc+LJ\nPpJgRfbtNElc0Ymmhl4uu3N+7td1cYGoYD+QPPVG0R5PncPv6FCA3cDKWLeV\n7BpcSnaJxB1fo+6CV04B54I3pNpR3jPj0aDwqznlttiqNS7m1Bv3r7Rd8uag\n7/9+CJGAold6yBT1pEne6DFEvP+I+G8Ru0hDncJYyjrZ2PQsDk6NGxRTkm22\nOS8onoAevo6EmXX1yRV2xnWl0gEKXgRIMmyAIqBug05wWKfq7W799ivh+Pt2\nDDQPnWAlON/e9fS+LQJc8GEnwe5yo556TLcN6Sq3N+kLszD6lirfibOxDmZp\nSSdMj1t2SBign7AcGroRtrBnWgozlilmxtzqc0TB9NyCap4bGSfF2EQAMHzv\nykkv7i1h1vuYJJunD/5JeKY+Ttohv8amlaesltFd8qeLVKJS8pixYzS/ft2q\nR6K/J9ekNwbFZU2W9rHWpC0C6lfH0Fgf04olysDUnurilAUAqNhxHW3+AucR\nZXLn\r\n=5Kfm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCOg0/V00BxmwPlLtqiFIu8etkhhawIeaKUUMqsXed1ZwIhAK89VwUFqS2M9QgGfv6/cZet24pzstYVWtAmTEVM41AX"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.44_1573445206020_0.09284901549959401"},"_hasShrinkwrap":false},"0.10.10-alpha.45":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.45","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.45+7f18216"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7f182168e0d84386d401d7965ed418513b644b92","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.45","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-esw80Kw8wU7J6U0XsECYjo4Y9N4+tjAkAWKnKpOE+f7cKUZcyNI3SOtXI9NPUF/pIvbF7E5MxKKHV4AMstFk4A==","shasum":"eeb18b84be1c3be70af8862afaf43a5524473e05","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.45.tgz","fileCount":8,"unpackedSize":13906,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOAICRA9TVsSAnZWagAAhCoQAJBiDmBdrixkNeBcgPor\nlZj8anyr+ImB6bWQ1kwfmf10WWs0DkXI0hO8TGmlZWntErG5Y1ixH9j/awnq\nk9sCyD8eJLrz8asdBAC0bVhYmtXcS0hlohAgrelwoDmZyBUoGKerfwHdMkBF\nYtYypkpGS7iet3mtrG/NWgm9u+6AIJ7B44K6m4JJ0/AEabH935TeAkILGmnF\nHhmAXAFZMkG9EUZXYjb2DBMWXHTqlf/bf5axo5ySlJN9fB3KWG/U8+diXewJ\nz/xdYRs2KOvp6zU1cuQMdRMScRwJtPAThe3oh05c1qiBg3B5uG5vGrLzRDrb\nOusTLRbQ9dLgDqgkxC2cxyg61nPj6XTPXZnj5CkNq10eAIs7T1Y7+puz6S4y\n5KhftN93BqQL5yg4rQZamG0wO+EOSmNl/Vwk3y6IXyglXmRFR4zv6Ff5OOK0\n2y2AYjz4JvLb5bYgNnMC1QUGYDi9/HauG4ZF9X2qePZwlKyQynttXG3Zvy51\nZQ9WVnJXbpyiM9Jn959VIAtUj2doiQrT8yYk2KX9pv5nOJXIQgkH0CWQP4dt\nZX58Vj+1altk+w4IglzOMAedDrBDdZkPTIKkpYGpoEKDSK8mQmkCXruIJxIo\nIvpDcRTWle3vfAi3bPrISqKqoeXd4oGvTZmpdF0TFinAja/IRLK74MUsTBMK\nlER8\r\n=2OUL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDmWRPsXzMC2nbt3lPjecFmyg6xyvxUnuNy7DCXQ/QO4QIhAMrBi7MAlVdSL+bxkzaJpdW8eAn7qVLpXKommklFD/gj"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.45_1573445639671_0.6961697432372951"},"_hasShrinkwrap":false},"0.10.10-alpha.46":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.46","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.46+d034b5c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d034b5c32cca51de07872298d76fff8ec3d91bf0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.46","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0RHB55qj1HACjlyBTNhwVcZPYH3T1rmC/KnF9RM8TcjN7k/yGSyUDR/mUxaHUVHsCdY619uQQSnoBfsta7RVbQ==","shasum":"424e4c2163ee55d8604895f406caaa643694e60c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.46.tgz","fileCount":8,"unpackedSize":13906,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOCiCRA9TVsSAnZWagAA7MUP/3HoimHsDaoSZtZcgNR1\nNJsFj7BqpCyPF/mHUEAF52C/B3ylBrUWcZiqks+AOij7XZN5qfdN+uUtaQTE\nQK8/UfJ3wQW1GZ+B1XJnSZ3lyQgM1Dk30oggcu/ccfmIC0ehSSlxdPf7vuPX\nTdV7nFGRnSo/3MLc4DwBxIK2lGv+OGkk5/mJS6D5dwy+Nx1aLw3O6Aw/SUZI\n3bhxOtyeN//wjYJoAGvsvF5aZ1+SxHd/Yxw8Pa2kuqaWp9aPVUZq4K+2IiRN\njzq9PXalgMPbHPCmnJtfbPtSjkFf4obwQYNa97zlHQ4zxApNh7+RkyTFUKXr\niFnWegrrBYEFDGfgs1SQDrtZVlAV8c7Ez6/Mnr8VrdjO+zRTvdelnlf+3hsU\nlc5i2Gy8OnWw/Tf3Nz/wWurR+eILYoZfubzPdPtrME+EQsJlCPJrNzNTsEaN\nelE2dZtEEjyC5HhXoodrulYmZdQdpG5ZLSsVEI29Uck8gGvOxDQvJ127EdCv\ntiV49Qzf30Le8tERjxEhUhYjPnCkM3iCnJ+/EeK/Uf/2HATZn8G6rgpO5r71\n7YSvmlXjopPSrwEwgsARa6UX5HN4gcCoByduiWgCk+vDZ68U+X4JGvaayAHM\n/A6UGKQ+5hOAbQulC6fQE/+8pVyR9PfBiULH8DuYfCMS2Qo8VZZZFhHWpEDI\nmib+\r\n=9UuG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCULalbasR+cmFvVifo8v33B4PXVGspEDfp0dJ/ROtnAQIgMTnb9IeDRGIud9GbnG1dCvxGameiENurR6rwOX4HKqM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.46_1573445794075_0.010406885812674016"},"_hasShrinkwrap":false},"0.10.10-alpha.47":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.47","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.47+ee06949"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ee06949e7c6f9f5fefbf936ab16f393d5beacb2a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.47","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ByA0/vlAg6VFSOOMiuG7g5SIFtUcxZIQMTL7fRiNGbHKmcs+h2cZrbU4+EgsuTvY1Ap0yrVwU31hYfWQWgkBFA==","shasum":"2911500ff1d983140887df240cd3f6bc07ba29b6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.47.tgz","fileCount":8,"unpackedSize":13906,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOEWCRA9TVsSAnZWagAAj/QP/1CS06F/fiY7TjURdX64\n+xhGkGbL8dHNGGqihSKY3nCt0orabzcii2TpA0nxq20YOPfjDJEJuEJgbTKH\naE74n8Bn/zR3ZqkSIZHgSyavZUMAi1QsSb9s/9fyxLnfyymqARfpYSqeHTfO\nzwVGp/8NtvXjEKgko+N7JTEKX459z7yoQuVZxQHfeHORthDqg7hyFsrURONh\nXmlDaYQ0YiiaFWPX6nM21zJ/U969zDL9GpimEaIoNfhjK49lg0bLsyBdOHLw\n6Fc87U6EjqHEtDg1v6M81ML2H0HMOejBNZFtvHf4jmXR+bFbFCxmKwINk9Go\nobalFZz1iqrDH8E+1gSs5yRq4BgADIrHySf64Ym2OVb/Qw3TQPqnFB8yKJPA\nzppnr5mXJEZA4U5guvY2xMOIdjt7DQ36QK6tpdNrASGH0QZky8vilN+ynyrJ\nJ1qH2XjVWSo3OCmDZWFzo2HJwN8T0tFsDNH96rF5ZrMVZWwB8KgcEYi3gsVw\nyiR2TpW1moEpD0NO3Vgors3KSOZKqm6xnVC37an0/6DyYchXpAYkochuEhJl\ncwhqmXJ1VTmALRbgVjhPRPCUbxJ9TSs32TUxUpRUN+bjtkAABuZDvf3wDyRF\ngZyxC0nTyaHApBvvvhiHLy7ItoeNEzUTKWCuGytnrKovR8Q4ZJzTHv03Eo6q\n6gkF\r\n=kJIy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCH5HXOo6iOSB3voEN95cN/p+C8adEkiBZtWlADI32/qwIgRVgJ2t41Vues/Dz008/Q6zKALqL7Xj8u04C70H2+Cwk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.47_1573445909860_0.9084726977181261"},"_hasShrinkwrap":false},"0.10.10-alpha.48":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.48","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.48+a211cab"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a211cabbc577ea23348da3464478da71a128050e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.48","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Qf5qMIZkoQaO8dV921gcF885942sztrk0A7cUqTL62GwqiBCPAjc54H69HWd6A+GiCI/Meg/K9+T5tWVJOXrwg==","shasum":"96ad10c607dbb52757669998d13327a8b23ea641","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.48.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyORSCRA9TVsSAnZWagAAs8cP/3xLOBQ3a4y0wm65aQP4\na5Rlx4e4m9R4PIHn5Tai7mR7DyGGfjUKhOUUjn1G7AR0jBu4p/WFZah9tzBz\n0edGQIie1FLkGkhQsRdVNp7qEwB8yGLDjKI8325fX3O0S83sfecXgKQfe8/x\nWHrDVwZ4GGX+7hahYXqo9pq+7pmFUxk1tgimq8gWq7mPxkguyKnvbMkzEgky\nSXpyzK8i1VSHHYtjCXGa1NguHTk5H2rRJrRV8ycAnUvhKueoq7VtIwlhBRp6\npG9Fog8iseuo8VuxgtLGcqaWtgxNInBDopwiicVDY8a+DDa6dA2PxFu/Ybmw\nhUDyHBmv2y6TkBgu14Yl1hNM7ZEDgA6O4fsW65OPhERcBSEjxPUSAphQSBZI\nXwuBPMC9qhKuqV6GSMiQ5C4F58CRGqaefc2KXOnWzgSwkhoWurym8amsNKKd\njZAiq2UmnyOGDk1JxjHeWev6i6zO5nfJmdwm4cXi5YgAzNavCwq9LFl2s72l\nL7omdGHMSpHAF3CI/t+zFzPWfULciRgoPFqFDXQ8Zjuj1opBWSO5VAPIX0aK\nCwU/S0RqYxNt6Dg4p4PyN46103qRm62USWntpeL5eGto3tXdOeyrqA8SfyPw\n0x4QkcdHM0LbWPrzm22m64htk6LrhnSOxffqPvrxOOAZYsIMkO8UwPcAkmbF\nG6Nf\r\n=bb3H\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDsqPgbpVEbrKdPNft+HA2nx3NmbgggNAZUICng77JX6AIhAME6GArlq9bKdqy6hkJsaF5sTy8o9YpHlzVNMj6x+1Cg"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.48_1573446737964_0.8924830255828644"},"_hasShrinkwrap":false},"0.10.10-alpha.49":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.49","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.49+cd398b6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cd398b628ab5dc542f65beab6c4b70a42a8c2538","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.49","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ExyEQtdOEwnYPmTtPN/LcCMf2sn2me9QiyzzWEy7FI27dlmPCyoHLM84nxCEStK6uwHy9xMg77FQ1SRnEWeKdw==","shasum":"dc245cc724d76d0cd94dd9318509f466674d9028","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.49.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOT5CRA9TVsSAnZWagAAUZsQAKTbvn2RIvqn/HyCnXiQ\nWEriLmKmffptp/gUFsV3SUHUR/hYE9eMIqP4GUDR9+8vwzR5kynyC2dDn9Mb\nVTLibLVSi75aArrZ8o65Ee+7fxRbmZpnteID4nHtO6PPHIi+NYd3485fsGhc\n93Ae6kqzYJU9fHtKBAZ4s2//Zqf5nrgBPvZhY2un71uIa+gQqi+NCSgB1lgS\nuaoQsXEaxk3gm6rEIIKLadd+xkhzoFxDcBI1Vb7Oky6YuTS1HMVtyerMrvJS\nIVr9CYw9O8KyHPxCtELNeNgEfpb8lXTf7hV8iNdgOZtkjH+K0l1g6SplfZW2\ni5fUgUHLWbXOeRt/YJvgdJPEaiBRURZ9n5IkwhrbtUCZGgAjCIfPmKTkCpNd\nA/E9UL+UWJJ+YV74Ufmr6cTNmcayyW0xxYEikoYuJGEOpXCv28UVqJc/NXSd\nMWLLF807pPWmziyyQFprxLaJidTxLOtfqnuprdKKgR/jocdj7QzpK+JG3XYd\nypdMoR0D+bFI3IeRbd2+9rskHqhEVuaUgNpvUMO5RXBm3J2ojsRxYANsDm/1\n8GrDbMGNMbZZWEVqxMBop70H2dPXtv/AAx4aSFauMtlmV+KH2UEeP2fn6YU1\nnFSwadt2I3zmW8mHo23mdwk76Oosqy4nx2uvjaNMbFeAkkjpP1H7Q7QnuoKn\nsW2I\r\n=Bers\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDxbtkn7t0Yls9ntAZj2CyYqMU3rwsHdIWba/vfNkA8YgIhAM+TJXHitBeYV1Ue8upHKb5aAAgEUu5CIz2elATVHZlb"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.49_1573446904868_0.37165929254406804"},"_hasShrinkwrap":false},"0.10.10-alpha.50":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.50","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.50+02e1556"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"02e1556e2e52a45d2cbf89bb91bde918a7ee22ec","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.50","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-hHEmhjZ8Pg/plmDWA6yMpxUyIvC8jSFsqzUVvYUhGIqsnHeRF30hd0Rcke1ypf9buEBwluFgjzzfU7IujeDQ5A==","shasum":"fb1fa406b518753b493a3d309a6ae3cf2ed7d762","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.50.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyObBCRA9TVsSAnZWagAAoEoP/RwLeNVmtVr32hACdXEV\n1v8pLroh3ahF6/D5O2qMi1Ujcb8wf8CvLGwxusHeoFIWoP6bA8HM/NXaYPnH\nEhOLuToe3VJIZEmpUyR1DF1GcCQxm+G7HLTtnKrsx7nF/FOfugCEqeKA22Nw\nJ/4D1d53R6IGIM83yzLSGw5hj1VPbufRk/tVDNFQBgHB26CXt7YuhJIY2I2v\n80VBnbn/l08tpA2R7mWshBO8MvV7ki5hJvAxZac1Ejo4Rc8xnlZat7e8qxFs\np308hE7zWy2Sei6KsJL9RWl9+k8ryac+pE4ihhrEz62/O8xHYGDdKBR3Ee5z\nYQ6qUQOKnaDvZ6UIhMGETK8avmclQmsUGHjDEv38ylQ0WRkmbSaCAC7sei7s\nz5++seXKimZ4nLWxIvUGroGEGuiJs3UxnAW1JRydN99L9fMtdfjv2DerPZ3Y\nZP2u3DVs+dGb3zcTS8ZoIFyVBuoDAyrZvh1c2nNDI/eXl7up5haqSsBCYczK\nCltERwjk8MXb3ftJ3GVYgBmhKifYlr5a6DG/QKR/v4nst5NFdUpO1yxzmbyX\nkBhweHJZs2REX7puLAspqqI14/anetlrlm1tSg+bQXPjALDN5dB3vWbS2o8D\n9vGTex37Cheke/58PZ7g15Aaw0PPvehSg8pWVlpnZr4bg5n4t/6M7Eekd5zw\nXMex\r\n=ZjCO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC//9xWHEaK7AI5R4QUVDUMHruGboSvcHtoLOu6QHvsQwIgIQghYYQF6YIHqUXER49ZzfUt96SVqierNvv0F8nlHz0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.50_1573447361166_0.6102745570264767"},"_hasShrinkwrap":false},"0.10.10-alpha.51":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.51","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.51+7731edc"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7731edc202aaebe63e5fdb7ad38450886556f9f5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.51","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-abvBDqwTfUratpmBs3agHqkgKr3lUumesn4EYMsI+ab7Yh7Bvhh5/X849R9Y2aXWzMsBNE2Zy+TG/CcPsZ0R4A==","shasum":"ebc0e9bb975f2f3c87064abffc9a650e053e8348","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.51.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOflCRA9TVsSAnZWagAAkKEP/Rsy1GSNLhUak2aDHqoU\ngDOi+eVi+tP6ZmpWyv835+QIgL4ZGBhmAfyUzDoqzT7AgFpgz2cn6PIikkb/\nxXFv0QKSxFxt7goxo6LmNpKw8I588u+60f2Wk4SHVzjIxT4Nq8Cft1LJqM8N\niKBdLBr51PnsaOyTHd21zbcXGBIC3Va4WgoMr6JOlqs+LpZ6/oLL5n91nBm4\nvT2GBgheaNlovedIY+MpVaif0IBi1rWkEczuDCOwhmYc+SI12/VCdovtVgMx\nH+if04tvGNnxrxrfBRSva6A1ncZai67/8srmjUTMNsS7oG7T8xNQzeLGDAxd\nkruZEuqbfTRegAa7j4/3rW/5S1dq5XJTYkvnE9FTCYNY76eJcxlicPnsHWnR\nonp973J+de5p3iVTVOluGt8aFgJLblTNeSMFfC/qTKruaWxDE2+YOc89gwnp\nnk00wnZGwwtuFoxW/7VGvhBo+8pPc/2J+AI5KwPqbdzNuwevPc8fkpLNafcc\nzwUHPwLZyphOOnozxXwMgRY8uu2ka1d3v+UycEXOmCWWZwY8fohWKWDMv838\n2yYNJaVoHQoE/xJ0J0cG0/f0vqaUkz1B7Ecjazg/SIKQ1RSWMA0Cd81XmMWY\ntkhzaHLakrwqqbZpJiJDxgoqhQ60lHIPETkSpLyGJY9AnoPTmZdMScaunMwn\nlh/N\r\n=+K8T\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGUSXs/nj70fttxdhebGPt+gD3k7o11I15K8XRQsUnahAiB8cP82w7lOLGWBjQ1cs0gEtEX2yukqhxc+2gpAy0oYQg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.51_1573447653093_0.15704469508486385"},"_hasShrinkwrap":false},"0.10.10-alpha.52":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.52","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.52+9064dc7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9064dc75cb41c3068aaea4ef69acbb15e4b2286b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.52","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Xm8OFJ5EgbEmAFA+x2NWmsYtclRXdcodomVQXHb+65MDV1tdZExhRyZXgTezFZjJlonjh1jzd/wZVaew7hVq7g==","shasum":"8fb86637ce98ed026ff08cc3701eb0f7cecb97aa","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.52.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOjECRA9TVsSAnZWagAAv84P/2wpYhkVpPiTTczePwye\nLQrI60DXv4zsN4dffNkgSjf/vtIGtw5FYio1+r+fXsYbqRkG1jzHP2/SbxGX\nRjHFO1jBkJNTKyOg/xEzf4GTTgjg31V3/GUADpU2qT8dZWa/8Q7fN6+mcYks\nleLOjUobt/gQb0BRyehv1BljM56JJjhjnXSN0Q4AmD8uNCxCZRsBK5NUBxW9\nDUI+Mv1VH4x/oBktqhVwONx24T63GvvcDKerQdC2ErUIA4/71LKv9tOOMuw7\n0N6/8iRU1MvZgMYsRgL3hSk2B2TFcoA0u324sdMcu7P/TGTSLtVG9qsy5q3e\nyYDRTzk/AQ7MDt2xLYm8ORU2ulYjubyhYXNPYUBGD/YRaIsVBZI0mLQ/sxKI\nZTtKETAGmTphS3r9hB3Q5BRaLbX0Bt15EYb7OB8XGdPMc+S7o6ZoHTDF9PiC\nhWu5Y7IU8ExNpL4DgZEf366Pa8GRmnCJHJ55u8ntx6epzhC7p3lDwLbNaXi6\nP25x7sWn+S3WXYIYFZLac5JDw25u3cZJaxiwA1c4W0aaxKC8M9oKmjW5kdwn\nYPLhF+a1LqLH9yGa0k0JeB4Fz9hN+VJ35RniTZyqVFbApPKaaU3r2ef8lRTf\n9EYfhD/sYVge0tTuzx7gf4Mb6ASZwJGZ6SL7lKEIEuqs4XMsBxyABhDQVAJ/\nhO7j\r\n=tMXR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDUu0DIqq//P+8A2qeZRKbwytpyo6yKNx0V/GBPziI5UQIgJ/WXiKOFXilWkId8o+voZadaCxDfdKsM9B6kPH5hchU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.52_1573447875633_0.980759729249119"},"_hasShrinkwrap":false},"0.10.10-alpha.53":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.53","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.53+9528dac"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9528dac50a56e2504ce83490ae941c1617df2837","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.53","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-EFrOOcQWxwbmc4ifU3Gal/X/jwJfUndA3B9xz2y0sQtRX/BUO/aRpvfpTOBovmmuxbhOwrTSPmbove/kuYOAFw==","shasum":"88073199cbdd1ffea9ccdbb4bb0dd198e20f652a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.53.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOkHCRA9TVsSAnZWagAA52MP/j1/krYda2XmDPRBdcr6\ntPdpFwfXKb94xmR7HQclFayeIlSfpGPUk0XQs+sESo4/zk5b3abm7mKbHLiF\nBhrHRA6EmrRgbANNqtoJjsb3b680hIFoZBN2f1lpbPA2x7+llyX1gxq8WBfs\n+tNXEAJ/N0YZ8LNyN0XATS4HbhBhukQ+6+FL/M/6NZRrVuFDLAIxrYyGq4pb\n/JL3eydh+bR3iT9gkkrH7/wXI54XYfT6Vfuu5G9hi3IOsN6r5cGnq2d7aDxT\nPlXfugMAx9EPq1Mn+B5DA6eq6sKLEx6UUjWxhNwhCjXW1+uU1prjTb73i7l7\nqJMYLIjiNou1Ns3yyKHKm+IfbhYm35+8nSt706JEZyXRgAyTT2uEOtk5fCFD\nRxR8941Bz7Vcqgo8YqDpzUJxid2PUBbyf4OU4hYwfv4WEfxa0l/5gBkah0JX\nP4vitLoJEzZyc7LNM6E6JWkH9n2dgL03IJBcDji4kGmC0TZSXVVlYF1kNuKB\na5Dcqgbxdoba38Ic2CUOH2Baf1ci6Dr6+4wjlHUQLRTNzRzj9jWGL60/4pm7\ntv/OhNWL01ARU1Wv1TRhE2B3IQ4pUj8UWTOKHAvusfusBE+YO9UYHgd0jVwj\nvWwljuz4kP1LGI7S9yEaVQvOeOulGHSkyWmIvOvkR4XQZFvBenGAj0ekgEGO\nXJn2\r\n=oArW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGUjPyLfJ/KuOzHnpugel5N1Z4IlYhoJ2KPyIAKDv7BbAiEAnHtUd9uPj6lAts+G+DVwx4d9aWy/KmHz3FnytacfGvA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.53_1573447942664_0.8773363129743743"},"_hasShrinkwrap":false},"0.10.10-alpha.54":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.54","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.54+757d8d4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"757d8d448a29c4ee6284983a0e190cd510195c32","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.54","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-t0VY7HCI1vGQsdOBMWi1oap7DDZyzjotEEVSkDTv3l9JnTNZUSuJ/iVNammFI5deGSAQ4kUqnvEkGWAoDwGRrg==","shasum":"0837841728fb2bd56add786da2ac77bcfb9564e0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.54.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOmXCRA9TVsSAnZWagAABisP/RAVpL2o87y+HXPrmMYu\n48MjGlK15fojUQDuz6v3vSfMnA37vdyZzYgaC76M76hsR4Umbtr8AloZ4hzg\nUHYv1Iyc+0YBml+vW3X0VVfNJv6NYdrP1OL4kmuBr6M4e9xNscTOJcoCzFeu\nd+koUPzpdzZe/p3OBYdLJk8mZ2UjOWDeCuPWwlC40PgMxLFthuQIzsnIYv3H\nwncmPV9/gA61dQG8x96HDp8v/HN5ZNRyR5Fmj7MIBVITNcqzloXuvHJvuJIl\n7j+3c8gRgUVUWfVwfeRF/XzxKiMN/K+BvL2Zd9rmiCi0TOKRgoqVsKM5rWOX\nZcZ2A5dISov7NUeyT4Oi2fGP7QP/mjv9XlD5AS/gx6r2vwD+5yTdM3VEysFQ\nw+potb9mIqiPozPLtoV1CNxQl5E1mI2liZsEOhKGSL2gg6EryS4fQf62O+iv\nehqhR/kQk7z7EHTht7fzF8r6OOOpO6N653AIgWG/xugpvMz82GduIwC8sNu3\nQF0n1N/fVjdO3+SVqHS9+CCfXCJ2k423UbO8tYq7yiRNmvXp7FM7CdLIPcIq\n0bCevDKAhPejz10bAXAdt4Nb9V9Qq2w+CGp4ISCvGqtxgyK1cr/o3DTi+NCe\nR8UX1iW2Swdp8Lv7NfN9eP8Qnc+6bChpjEwShp6vG3IVZfdPqGDLFPFvl6SD\nzmoK\r\n=HOBC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDy5jCjugEdmbs0dO5Cm5Bk0X6ZypH8iNT+wg6n+L6I5AiEA9i0zWCF0UlCw8pGhdXexFUQOZFsUSCQT5ZDGWGbvnWs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.54_1573448086820_0.24129497226097785"},"_hasShrinkwrap":false},"0.10.10-alpha.55":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.55","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.55+21ef99c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"21ef99cd3f0cf377ff7db18855a36c04189ef07c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.55","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-nFh3sdGdmuKcH8zakdGPFfQe5GS+UbUGzQgmCdIZNjmFfwPKuVVgq0/oaXK+cUXoAmoEj60/cepTnWzKcLJoUA==","shasum":"50a9c238644b11506ca102d917ba41480b0a692e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.55.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOpVCRA9TVsSAnZWagAAK0EP+QFztVWotAPl3Idw9K00\nOR1+nOk4+5y3YN59PY9FDc3AI/AQPW2v0cQ9LTUVxI6ZVS/rQn9zsjnPF1cC\nLys7X61gtFKnyebjZM5xV0h0sDwzYGu+CK6KNkUUgWIxwNyYUmoZBRlIe8kV\niyXa4DL0uahKNbPlJKW8s+Ni1wRRUzQKkYgUr1oMSFXtplTv75W/3G4Pp/1K\na3HYJA2h+4bSIVeVKAEbz8MLyyDHh5A7vf04JREu8peE9001N4cdPyONo4/X\nsu6da2rKlJBHOq9k6XjWKPaBTlMaC8ErlaY3ZQyOEnhR68M4SsBilbT97MmA\n5CxmiJ2fV5sQD+eCXfY/9CTimocvNiwzpPQBsBNotrMxiTW+gXQfqO0FD5fB\naK6fGnS4l4ubAcE1weKHicpQJfOciYDdfuqtCkIKufk3HxtF/WWlxkCXqRm9\nMfQ96wuV9b8jIY91R9xEKyWi5K5+uEl/BzlUxUQaFBrrMS6tyes7ktw5cgPc\nGpMm2XnmBSixVQPKea5aBHxen7rcy+2ZcCEqbyXG1GXqQobgquJiDajG+0l9\ncZvbjmNEwiDxk53zkgD/bSJRuex/EhMrsZ+DwCuHAlxn8eup6bAD3MMSuRe/\nBvJ76mtbqagdMeqN+A1iRIlUMsW2aqga+u/Tr08oE9Xj2sIjGqLbTVYT5jcc\n3o3K\r\n=SYw3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCeTQEi2031q75FP7eBdjksNMbCg73CA1nNZghb9RPWlwIhAImByqXWG8vw7HqxXmLPav+Qc61KFvZKI//p+g7C+2yj"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.55_1573448276810_0.9028862282830341"},"_hasShrinkwrap":false},"0.10.10-alpha.56":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.56","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.56+8feb80c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8feb80c12ee777c72c6861819760d3ce620b0de4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.56","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-84Ng2v4V0U1WfM+gQ5CJCg2qoVXDbliSFB1pNnxiiMjTMAoFa+dvUU4nmBpG6MHO+zGB1vB2MiwU7/Dmm4b0eA==","shasum":"866192abbc52bd1b1af6cf05ed8eee8e9a5bc049","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.56.tgz","fileCount":8,"unpackedSize":13887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOuyCRA9TVsSAnZWagAApL4P/iRwB0oc+T4qvpLnNSVc\nWK/T87jdqRySwcCZQ3OTIxFqgzGd5T3spQUojHQOAfLvxDp+Rc2HVFnqJhh1\nMMNiWFJB5PwaNSrQ+ZsW7zY83K+6HbvmGiB9dK0/4g3cH+R/g70FmT6gYdp5\niW+9u/+D5Hp5IQgJ08I6IugZ8xN7capoyaJmmR0enaknFJeqUxKz2JWbBOKr\nM4tzEHlpvTV5Yb2I5O5oKoD42wH163k7+opOUgS+wcSlRVqKdmc770dqLF9S\nbXHPv8AW6tANtj3z23cxtrotXrDYk/zCwMkKoLx8cdHt526qgedPqh71377e\ny7DuWjTxnFxwehoLvgGGG59HcqqD/S38VV9iYpw17mPWLJ9RVVpP86fZtosw\nTWgenKCxs70g+xbVcKxOGzMAbjJD7RR3h4ur6mmpbOtrsyc71ZbwasQVeM/S\nzf6sYQGrsrcWNqm3SY/WfQocZOdRw1SikyHdHNHwpa7EcvsxXyPBco3esvNx\nKiR07mUALq8khcloM8vXylXIktTEkVWUb6JylQJwOWdU88gpICUU+ylMnacx\nRzjledc0349BNTNlmNdDEAWML1Nmj/aAzeNtZ6+d1aKIXkzh4Yn9rgAgY5Bb\nJNUS9jZRAjCGT7o/olJiFY7aOA7m0zJs1onpjJ3bDDEN9pI3KQ6WFL1Qqnzo\nt7QW\r\n=SK1u\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDAxLRlxO5QS/8Q2Ai8Xwo5KShtKKGagRz/pePmRIX9WAiEAvyiLAwaBWKK7RePY9h3zU6sTi9bX1u6FoHFjiZTZZug="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.56_1573448626099_0.2500754197494719"},"_hasShrinkwrap":false},"0.10.10-alpha.57":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.57","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ae232bb07fb95623bf03cf158ab9c959e3287180","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.57","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-yYv+Ti+U8JCtwY3So6+olWvPWOxBJaf8+DI3mjsYvqP6IAclm1MM0yPFOE2j/j30z5OgPSVkL8n2VUh19yf2Dg==","shasum":"a0b03d999205dfebd92b6e45a407e17ae2b70231","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.57.tgz","fileCount":8,"unpackedSize":13890,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOwCCRA9TVsSAnZWagAAsJEP/2RjJgFPGiErMRwXLcMe\nBZqZ2ZpPtZ/dj24NOhtLvywGVWeNRF0sYi/4GuZG88aLSubNWGR2MrjGsYH8\n+CwyuOFYUnT7UXmGNK9AsHqOCuC5uNJw9QVaLzp+v6o2b0wEgnRb9YB8Ka47\nFgDAAM2xzEhkZHHNgIeYgZZ+z99RvTTXkNlC3s9JQCwh4IZZ1N9+fSrcoDWI\nQA/yYri+ZvLntJleL78H1cfMkwli3C3oRRiVzo38Xa1ot2SSpovpJ5LarpuU\nsNWcNDFCIvzAsLfMzHBec4mzQimRr/1N9FMnIhOp3PbRgGOP5zb0keBzQiYj\nmeoKsAa7ketYtpUlfYUPKsQYAnm0GukqXvkNBaPa51on/V2gZUq6uwVJrnAA\nhnE8CE7GSgYTWLhtXcp0ArZVt014WyA7sVmPC7HpTvAuRD2o/unKeJndzAUz\nQ8wy9IY+IBtsKWatqARqoIPcEzZk2fPxRGR/vAz6H/iANAEXykuynfxSHjsp\naXXYbgvkTHVvzmX/KFEO2Nd/h8KlzRVp5NVV1ziSp6hZ1kHcQQvcjwxEKPBl\n8LFsk44ymdrD6pAC7aRF8KwPLUrb7hu7SRrXbcXp17FYYhN4lXh1T3xPbUYW\nLzEvUf9xidPftZ0b6GeffgT4GD+oH36/8+VIp7bCH3JLI18jBbn6D5FoeJFj\nBi9n\r\n=xO0I\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIB35HYUcgSoJTQt/oGyG1QUt17Kw3zf/CRt0JNcywSqmAiBahe59oeeUjhs08wT3ONDRlJpxNLitVsGIkAsTb3e89g=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.57_1573448706398_0.6434447166376562"},"_hasShrinkwrap":false},"0.10.10-alpha.58":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.58","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.58+c33bfbb"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c33bfbbb035192116ad776d8c9590424992d5c6a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.58","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-juJ8snsq/vXLOb8QLRq2O+TUHkOoPY1AYyp1tGnUDZ7X1th4HIyw9K4yqaHM0fS9oP9HFBgYmUu88RqviI8FYQ==","shasum":"a647fc935430c396822ee3a5f116b6f2ebc8ee45","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.58.tgz","fileCount":8,"unpackedSize":13908,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyOxfCRA9TVsSAnZWagAAmfEP+wWRnKchoxorVJ2JJ8H8\nPG5jUscM0B7icVXAgXvmd2oYVvw//yEqHoBouQ4RPtun8Ee9f3mENrKLC74p\nmN3w8Kj1jjlyQLdKTttKE206RtGSfxU04/xaBEXC1/J4BPF7zJ8YbVutTnYZ\n+8/0zFtlHEpBF48D3eZfVzvZZEdKRNWKREG2+1nPpAms73A5+scYmuM6K4z2\nrLMo3l2zj4ozDXrwti98L5jrMmjhUW30YHUJawH7zqMeKmX1TVq2g3gdh0zX\nuFh3+rXE3VmZEumkcOCMPTy343hQmMMDa9cOwBTkQeUMlDRlQUtoifIxNvnS\ncjZO1L4Eh0EDWGHufY6MpNTGUAjNMohsFR9r63ZA6CxMXUFjsnhr2fqeLAfH\n5S6cw0pBEHmBZ/jMK+hT/yR5DQIfLCABqeWIRcuEEgrP0IN6Aou6Qn0nfXDA\nAagZ6I0mfuDSog2McTdMRrEEe5SYzrbshEa54yS01ihAgtB6wje+vKlbB/2E\nWkgaj+FI+XevFO8KeNBud7Y9XRaM8wAYTzdayC+qJwPaH6GxRwCfO8fao45d\nDYuWmocf1u8pWhSzP3llpTdHt2qiThVMWCPn/StKhfetCg7tJivUrJuG0A/0\nzcE1Mgffergz5Zkw2qMcOftmwDtBAGOwQQAvyaOyyri6I451l7ftt2OB8Ks/\ntk1N\r\n=uSTe\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIQDPcM2YUQ3zS1U0HBRPeHRMMNzoODi6CPoAnBGZR1EL2wIfJrA5392TXHpihUJ0tsSlCoUjZlv7SscXQskcBDLKHQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.58_1573448799375_0.39303509797440306"},"_hasShrinkwrap":false},"0.10.10-alpha.59":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.59","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.59+0030cd1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0030cd1565eb8fb2cd9fffc71222ae425958863a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.59","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bDRJfY+ExiI47z2tOTQCt7lYjhv/e+rkMOQ4B4hsqOvTlBvG9zDwM54J4mSFzqO25qAmRiVyUMtpbJbx1/v9lw==","shasum":"60d0f5245257074eb6c5f42c6949f88e0dfef24d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.59.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyPAVCRA9TVsSAnZWagAAuLwP/iaQo5inGC8Ey2DJbQ/w\nWLqn6FKZSE0TIcYedRDRecfuKnb1xLK9ETVeEeLmpBxVZu0qz1Eg5PijRx3T\nuuUqNdup93xt6bpyHXDTUqcrrHrUmO5rNxsWPJ4ZghbahOsWpD2cgtd6SJTr\non5+nLOzO05ESqi/Ifdm9yUYRVGM+RL//wbPMNYlLTLObv61e+sq8A7kAfff\nZx6Wk/z4rcgqzr3dEpEKHKuIWiWVHxIE4Cp3YAwX4/R/vCiLXCjl8g0fEeU5\nG+8zQuYfkhocESGy+tvZ9rmzlwZ4RX+Bx6hNoZ49/eM2nM+8Y6S7mgaTfYsR\nO4NIRygQEuNk+lfRbUzjrnI9MLx67B6Z8Q0n6i2RnpXThFOmSsZNVclXYplu\nYr50fmVGXL5VPjTqCLmRAv4hcvtsj6Ey5biAJlneBW8MvDKNGcb4CTJiIb2k\nf52XZMKNNb9uN40G6jBdWAmdF6lVatjavLXuV9Jq/Rg6f+3yQRa8N+P6hpTv\n08hpwHZT1bb+8/s4/hIFVD89YCplhcUV5+TvcQFtlxKIY7EKg6wD5S4zYJqH\nIkhq4l2Xi/DkUbc2HtJRIXr4jgTVwmjg71aB9AOJbWJH1tuLHJNzDscBPUOk\nmSyEiWHtClMJE8QAOxs5rJeSlQ9Fba5WIs0oHnmztR8pMO+Ji4dud2G4SgET\n8xx1\r\n=0FFC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC8duX64U3+DmYjRNsxTTRjnSMQhtmJaXgQ13VdGv/FYQIgVR/YB2z5vsZTZgoCbdFe2oSer4okKAfENdi1Z8zCZVA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.59_1573449748931_0.27210825138531036"},"_hasShrinkwrap":false},"0.10.10-alpha.60":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.60","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.60+fce7e4b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"fce7e4b90ebfab27f2d2aef6aa84a1a923445cd9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.60","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-CXvaRjIFfgiEBz7sw4KF/U1aYm3UIx5Zt1T538asK6CCbGdsnxqc7ogQ/Jp3oztlIHLS1jNDSx9xMOlZxcrZYA==","shasum":"acc5b4212798eed352f99bea326699e2e5877033","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.60.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyP9GCRA9TVsSAnZWagAABfgP/RkNANc+c/5QHw8kXX61\nlkRRnHPy/Bf9+QGb+HrBhDwS3vQ0/IvQkWeLx8JJoHb8SBJS0tGOzKxfDoGZ\n5cMtM8UPiJguiuFRiU2V/163YmCJUFoSB6MelBhr4vuS5U3iWgbFcVqQcWxf\nqvKqaFkxfLzrt+hA4C53nDYTmoQezpAQd/QsVIqQ128V2hnWgyGU/KYuacRh\nDfllWqtxj+uhYewE0ZENqrHpcBJFNUlArq4wLgHR3dseAmEQ0NMNuAMjz6FQ\nftdiNlDFBKkF+a3pjdFtNNWkWot1SvKkPblqK23ez0MbgZuu1BTlPTYH8k2z\nlwNwRgXdNoSKM56b9T2qheVxAcBmxo1RB3g3GnQ+3tSWNypWQBEuwYa365YD\nekPcyhqUwNX+0W1uNGH61CBDoZJIRmYJ2B8fc4IejZctROJJbFjvGonn3e2R\nmdHgL8l9ghyPIdT5QVbVhhmRQCAfG28RpEKPj5XEKWvJ50+YlG3Wr55K7JcG\nnRs/OgzFnDqoQwRTPunAIpJE+MuJmoqiALGbcNmhEUiZDYyu6kaYnOrxsps6\n36a0LFBq6TxwUWqWolTelopG2lcBtBKD8imtG6exc+EvNGwhcXkwIHiYZP2G\n7ACksOkybTtE+gZNi3vO2NjMZrf93EDkf3FENlraT8/CSlbUeACrtSO44YeP\nR94k\r\n=ip+g\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIQCkx4tINn8sXRaJCUT47UIkz7I8DhJmRAo9yfwqZIhH8wIfIq4C1niwlu+TpAry8cLm3g1R0Acf86Q3kIA6r2INrA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.60_1573453638142_0.21115067026401024"},"_hasShrinkwrap":false},"0.10.10-alpha.61":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.61","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.61+1442370"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"14423705977b98842274ff9e7f50a4e2f7adbc49","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.61","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-kcUS546O7AGwyVw7VjQGzbO3J+hU+uNy/l74CGSBZTFt6OLNm5Eh7grMG6x6dBNryacO8GPJC9swQGFKcKcKrg==","shasum":"5521a8849ec19d146bb84cfc89669df695c2f4fc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.61.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyQF2CRA9TVsSAnZWagAALT8P/ikYjaU0TQN3D2jn4kk8\nRZOWCqkFMuFaKrdgulZzkZwzzMqru3FJaV/w9KQV44oSVwuKW9s5tBW6DKZ7\n8AOB17NlJdFTHNRpThS6FmLpfnLLF04LEGITX9p6pFKtVxEGp8vGHsuytFWI\nmDN3xUQxR+hTiHcrnQY3927eqnkW5JG7EpV9Pgn4Niydka68R9Beo9cjYRcp\njSCzwcOlBp7RyNmJwKjSQQya6Gg1AS6NQYp9+HkSod4movf7JFmCIDu+P7T+\nmhnBhMtDtCapPQp34WNAlZThFAPfmLcDZmwbJvCRu5QsgY5cjmfPVXMipXgu\nQpYiSJ4QBt1c13CpjxxAlURolWJYMfsXN5oSUxDIxXBCdg1IPiBP4XiAcE2L\n+dpZsTEi/RK5h7vMtZcVG6y8iSIozzFHSsEC6HZ8Jqzavzqq2nfBghXGy8qL\nG/9eo86l23OH/APmNshF0BK/BdOeI8hBSrqj3RSz9cNgW/LX53dA85n0+u0j\nCfhowj2MAE/UxaVFddQjgPKufkOPEOxDedR3nHAnaPoGMkaGxurtW/+rKMzF\nG2DcDrhqG1ZDRAfJOOCvhD6wEs0V8uQ+Lt89CBzaEdF7K6WSHy7XvPzAGt+V\nJYavKah8QlXgl5AZyvrmzMb1/BW0wMp5xO71XP1/sVG2gcwlPZDNHf59juB7\nY9HF\r\n=0rtg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICcwAhOEawARsoxYhs1QjyewgFidVyOXBCklJahg783KAiBGpmtn7S8npHMY62sJMyNJjghO7gTmauwIltn1rS93gg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.61_1573454197956_0.5536705422064174"},"_hasShrinkwrap":false},"0.10.10-alpha.62":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.62","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.62+3db6f0d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3db6f0d1e88c47596811805c71184d46046096f5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.62","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-dOpRJ1A9COPWo76/+TsQprUP8IHpnj8LQ6kMoATi5VVY2wPyRDsRA34a6JA6YKDZ03AcXKzRwMvOt8Jh5Xmiiw==","shasum":"22520dda6846ab12dbe129bf3226b81a38097132","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.62.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyQHvCRA9TVsSAnZWagAAxqwP/31qy22cihsOBdFgVRL/\nnzEgCTT/3Qdq5I0yaBy/MxfN2Aw2LI+J/NpMTHYClRNvQN+nkYLIgDy7pFOW\nKwX4qIFjRItMUr4pEhmdhBzCoADEVaapb6azM2fzuG7TICv1WltvRu4/2dbf\nTLTi9nPpaCCbTcZRppYKnJAP35ErehPBNeiPvHQTvJhYpg9Iqf6edgrXzXYp\nDNOEKJ/BqVnLg34GAqFfW7eac6cu4kVnFIjIGlj5EvnBVc8jbMpAJQDYcNp2\nLbBGadJ4NEXlTGyAJdVziQo3py+Nc2LzaFR4HBcIuyUvtix2Zi8w7YziSoNO\ngzdToN7G7Z+r0rcUD8Xm5+DBID19UN6epZZDO1T+JPcROK2b88+tJKhSBzXg\n/FQMUAFfrnsYwO8EfS8vx4VrRBYpEwsB6cUyttJN/QdNOiTe+hUC/KeDeIUk\nzi1SY35MgjbuDN+VEisfZy5Vho74Ga9yILNOWcryR97RidFONYZhdSY+T3y5\nkHZo0p41X7FtAJFWyYEgFXgmzSl35vfEA41iZ8qK8XXfP3J9YNSc16OupX3j\n/gW2azrVt02fyDLHQypcetfq+t8ekN//a9XHXw3uyRVHrVsv2+0v9QA4bS0H\nyoS39Ca9y2VoMvwFooUGja4mbboZMz6zpfRWIrH10dm52+twG28J+O6d8Ai5\n/bxJ\r\n=pDqi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHns6UaC3YILJVcydKjSWj6YMpSo7XU8S4ev83e6plSGAiEA+j7PZpgtqe4bmyjp77oBrKzMqmagFz/9Ou8vFsJ+ywc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.62_1573454318649_0.6404773433861206"},"_hasShrinkwrap":false},"0.10.10-alpha.63":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.63","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.63+5e67e91"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5e67e919f2dc415e04f481086c0decea77632974","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.63","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GEcf8EXJ3EBY391L3DJIWeQu3srNVhzPm4uUxTQzAG77kSyiqvKX7krJB9mMINnwZBGkQul70XbNg4CpQPh9Bg==","shasum":"05cf700ab99f27c01caf71d2568f682d1b958578","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.63.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyR+ZCRA9TVsSAnZWagAAWQoP/RnuA+GmSZ8HvJ5vbOXH\nwrGpB47L6+TWq3sLAIcxBdEpIAyyP/tCFhQcjMfmcIbPMaavH+hsLV4xUjfn\nBv9T+ywm+K840c0fNI2WpubWclv32mSiDGGWm4izGiWyoCO+yevjBsC74mk1\nRXlXSq7TE7zjca8GZFbZeyDFA8/1Yx6QaqqxrfDNEEghkRV5YapK2uJeTDDL\np/0BFwPLFnrllG+bMgXVXJAxmjJXCY0mvjw00JKrYy+IEEZ/FNG2FiZVr5SC\nCBEEQFE1GXUcMo7UJc40FiZodW434akdRjagRQ7vHUL+Kvg5ECio7IG7iNkm\n7TpJr4Bzthu42cPAk6zM1WsSqpFSDSXFnAVzxN2TfNkwJyVvu+TvVqd1uGJA\nXzC++wZQcwvKmk7vuENh6+0HSHNlv40lVlhYuN7JxgkJbTLQBfnBg7N8oIZt\njsxciuF8VDxBNZ3LEFNaeNnI9u6NvxBRb3vf4tHFJbQSaijoCYAbzKDvFGCo\njn67/55R3CaT70NmRxi9/cubmJR/6XwPPwnOM8BDhoVmNYllcuHFIqBGCujm\nbSATjDdTFS/YVgZ0yEBPz+fyyHDvHE09TbDOMKzBzDu3MQYGEma8y4Eec5XG\neqtHtjQtpEG1hSuBWSOXDfGzDWT5mgeODL6YvWyFkK3nMfYtuzZvkwrIShKO\nBr9l\r\n=8vwo\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCPTtX7NxO7o3vF/gII5YmGjqdE899o0ocDLHcNQTJ4ewIhAK5sIkPBBjlbUwlLENj2NXWXxFfMtZrjyUNSxcVnJ0MC"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.63_1573461912645_0.6435556702973464"},"_hasShrinkwrap":false},"0.10.10-alpha.64":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.64","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.64+5b7438d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5b7438dfcd26ce2b1e7de48e21ce9f8c50539cbf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.64","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bccRkgo3U28dQeaKzlwLL3PxXg9GRde6LQjdDX6b/4NdVavePvoA9Yz2hDja0LN7rcVPprLhPPqFFY7IJvezmg==","shasum":"d35302bf6bc94f9969c8508e36ad4f0baaeefed3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.64.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySBHCRA9TVsSAnZWagAABS0P/iJXKXFIvkUIxlKvBsNX\nhQos133qx6A+UEzJijnRJ6l3eePPQpIrNy+5Y1eNs5Ct6BbLX/wyLcJwMYOZ\n7PjG4R/QTU8Vysfvv1XrsU5EJ+cyjZ8L1kGhufxaoKyBNQ8MO0Bwb+epzL9z\npY2it92eIKBy3Z6ZfA04n2JrWALIBTXYFNv0IzqzbchViu2LlLwzwJe0Hkh3\nXvYByvV5utU5oxZn2jlP8lEtRcaOPzfXTvmlS3bQDdWL/a/+kYdv2Av89egc\nDXJECQJ82kBnDVDrFmRMW7pjGrCLweC25fjL9e8QVW7qrrVo4ItbojsKhvMU\nNRjql/2+k+nfHiFjKJRNlICSz9oOffOgRrGav1j//bbzsJ8qmDDwf+AQI496\nTQWP31akYJkdrtMHkPwdohuwcxeNIaq2vcildpq9K96HODxdfXhVxaw54Go3\nP2SoXpv/RPROdD+QX4dbVdaSsYMXLbSKfLpcd+v8J49avlZqRi1Ce+rWvjlI\ntpYjfWIb2O3NuakmqYFtVqF/UqLmH2RCjbJawjDFA8EuyHYJPjbi4WnZx50i\nXLu4wKL8diINjeX3EhoZSd17WhrQThy8AngZymHpiTTAqVsAqHRO8yNzv7Ut\nmJ8YViv/uVoUenzARBucvK6WecOtb7iftzIwHMCKRi5aKESGWE/hZ3SCa3WX\nwNKG\r\n=sl93\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIACxYih+lifIfPG8ZDpVgbmw7gkCisoh3TPMDHX51ueZAiEA075iybIUOQoGb0lBzizJpsYLkDL2obPl8HAuAh68DV4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.64_1573462086947_0.1627272933531374"},"_hasShrinkwrap":false},"0.10.10-alpha.65":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.65","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.65+6991335"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"69913358bd136858b92a28b5498984bd18533c2b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.65","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JZo+MqPSoTTr4sA7v3uEsF+CGCtebKZh8VZN4gaJB1i0S5RBOLtHJbCP+GvbEOTrE8+MhCvenIk6/O66qPxz9Q==","shasum":"8cbb39dedcddb10a58f54d831765729999966091","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.65.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySDOCRA9TVsSAnZWagAAtPwP/0TPBSXN02a2OUSAeUeY\nzzyrJwjQWt4/czt9fZOvVptmdKxXzRuUS05pt26hwbdp6XAvJm1VItFF4fDT\naXVW2IJh8YqrWdENfKMBZGehynMZDqU4uIWMrSXV3rJY6OTIIFYE83yhHKK4\nofgSAu5lLM6v9xxFcy9R+8JtO7VJarc/SIfPmgHJmWB5NiFJ2t2GMpVFRTQE\ncmfkwixcQV4qClcRvVriIdx+6zshPaTb4ECvJeQqciclCFWqGMOJ9V53p/PX\n3qxjdXwGIOhTSLQHUMEood6NXJStqLGYpQ7WJQcqxqmtDW8HuYoVyca0q7Jw\nQ8f/DJ42xctPjanMrk+PfCvqY/+gga0ZKsWopVQCrHMsMbdscQJ7GO9QO8w9\nZ2TlParWuzk49QZeDXMBmF2ZQYN7OjZd1fERGjKX3SJnfzzZ9BZ/upln78u5\nnYQVL8/JSSTArdm1wM4dI0F7yQOa9PbH6558ZP7DQW3dGFj2oxcZW1FFO0kX\n0Nq3wVpRiLHHl0zB9txWDUNT+adQPTjUn6/gBX3L3Nv0E4u9rzBBgmedOt5r\npVdKUtVO/+FC3h3DsZ2WZUOg6r06hnK/srqHBDkydQIVpCSxJ0/16TA3TvDQ\nhvycSG7ZRhv74yO/JRqhGHEb4gP9JTKGhoIfXKYrNiht74v/z47gfIUY4hDj\nsdR1\r\n=Ey56\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGjrYry3KN1P7c2qBb4qHoQT5wwDLDCAx6gDRlxALwH5AiBFe/GX3a9PPX87xbK06wnTqXOBzb4W2aQEnqdwatDB1w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.65_1573462222251_0.5628588914026673"},"_hasShrinkwrap":false},"0.10.10-alpha.66":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.66","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.66+49fdf3f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"49fdf3f8daaceb621f1969967bae963f02145236","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.66","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-3h03zFgaZu6OvaVqwIi1UABNz1RASbJVjdAKdHdk+ll41lalMV/bTQBWxhrzEc5eM0VKfh9IGN4IXhsT1yFjEQ==","shasum":"d3503872e2c911b294cd70a43d3234dd257fa6bd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.66.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySFuCRA9TVsSAnZWagAAw7EP/3X4BL0S51qcRvZyx4Hg\ns1EORZwS8T2AKJV+ghNTe9GIYCvGyrwfI/YJ1own6dtwQftIFeEo72vZhbqX\nekDEDaTIz/ixuWLjb20ycLN7R+Cmn7YC2ELRfFg+SJH6Leck1Y+slWH/WfsL\nx8Vt7XqNTlL6Du7LXTaiJ7L+H2ouuNVPmAQwX/z0FQnIEfaMLdfHby1MS3Z2\nKlSerJlNtcKdQv1kmuvtVZCb+wdzODiypzYO1F3wK7FEg6JFcLgCa/f8vhcZ\nExbQxrUSBge63hkdRAn69DLrUMl2LlEgST0K7nJhgKIwItqSdJWXG5rTz7JT\nZmA3r7H24zvPKj3gSo0YcjgMe+49Y5MjscSXl4OiOQKXrSShly/Gz4ZhaPwU\naBqRHDma9CrJdOlTHYrfTgJvq4OQBDfaWL3IhN++yCBk+i+6vua0LDRE1xGu\nVzNFC7UbiCE9TLUv87FV5QeZo/RAcM0MDUHlJ8ivxiBKmWtE8oekVE+vUS/K\ntQzT9WHRd8dIViKYmmcm0DzG9cchLDVQM65UhYg8yuOUTp4RCTHWTOAPhVKx\n7rT5ngc5ZTc3QzUEgQ7UOxteSG6g2Dtk7Y8U07SraeCvvuGftg968gISnHPk\n/R8pXgX5yswVI4JfSKiL7COC5Yj7/umuuDmBPJdPntlyM8h8oOixZaKOuHyn\nWUkw\r\n=/eB4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFZP8rbtEJAP0qKfrz4YOOqHJqE9fqB0UgED4UPAypfkAiEAmnfxI536Fe8GF0udZ7yVVvWm25Dq9QjMK1f6veJkq5k="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.66_1573462382509_0.8872971677737558"},"_hasShrinkwrap":false},"0.10.10-alpha.67":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.67","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.67+9960d9a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9960d9af0f18f25e7bea73a801e12b1ff1422fad","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.67","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-EJ/oUasbtDV+4sb+wh67RkE56QvSC7dPjAc51LdKPhp9PP51HV2qKD9n8U0nvZmTmNVpTUAZ+duVguh43s8Ryg==","shasum":"b7e5abdfa07cbfa4d96c25d1c27e339dfcb4c4b1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.67.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySKKCRA9TVsSAnZWagAAGZwP/jQqICTu85Of1UBxBeLS\nyVnsR4Qj/w7DHggllxWE++hp2U/EYhmJEhBe7h2gPw9BuIJOwA/svkWzzBQH\nS+oUDXndIWmqG+QovY62NoNa4/VFUfVT8fvRrcGlo2ktFIEPRNPHdqu56971\nLcPqPNnj3Xu8qhi03RIm0yvnuSyrFro0+mV+5ovcWDsl9waIfQwZn4CyNspl\n9lfilF3mwX3LY027y54uoJ6Qw3GXQXqmWKI20yuFo1XMiI9BaotxHDpTqqwj\ngUMhr20GNJxcarqI95nGnDfPpx/E/hXzmEOQcAwn51gworAjNYG3CmbdUq+8\nRMFouvU5ZBHyFlUxhNzA7PP9JxjyiXsaeEX+BupBy+b0iqiIzB/zM2UjHLNL\npllU3USBagQM5/GIMki7pkcUgYTUkqVDWoIUMPI8HglZhiofKxeb2Y5NLgpN\nMZLlXfk9mvig6tBol6t58hHn6Wq6bN53xDhnZu7cKdOoG07HeesJo0RmeWAW\nG61EzHDzwF4Np6l2V4OCD8NqnBCyiy7IeAOTMa0oobGPDQhs9xrVsR6q67rL\nU1pklIBQ7vYTMs9cRBQzOG7mdk3z/PvcEGFtkSmk4NqwvqUvCpHiodx0gRX+\nqrUbVJsC3rhrVxGywHo/qKfPTA/ynb2Ldbc7D3tMqKcnqBYVWRQekverY3F0\nseuM\r\n=dIS2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCinK2hhdmtPoKADagzNq9J1dUWXq14p7YE4BlrYV0wUgIhAL4obcmbMModyfEQcLKIq1ElMBHMvekxamaluU7ZQIzI"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.67_1573462666377_0.8833876329477905"},"_hasShrinkwrap":false},"0.10.10-alpha.68":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.68","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.68+1178d0c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1178d0c3a9227e51085da3b0062803af07407c53","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.68","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-36C051CWzT6v81EMzsks8gJQuzTeDCmKDhB1pEJOiU3YpfBjO3Vy5H5Hzum8oh8WOXfJ6GPknDPYDrKUiwtuqw==","shasum":"95427f3588b373a03b14223361f605fa1b5bf9bf","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.68.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySMDCRA9TVsSAnZWagAAt0MP/iaFr1/XJzFaRg6/eu0S\nN8sAfsP9BP6s+haiyQ8y+xcweVc2sMKSKH/J/QDtH1fG9Rpy/pyXOlUpB7pW\nIFMiNNVv7OlQHrbHnaxF1n8BXOgUR5RIHPww43kQfjk8iv6bXf0xIqsdCBcL\n58zzTUDLNtKKswIRcufuboLTFFtoNSDaxr0Ct6EAPWjtkaQfzg+uTaEwCgR4\nRqLSTGz+b9DOUJB09WdLzhLUwkHCB09+Q9LmduLYrlsYqE+0OADmXgfzMpnn\nIKGcF3Ax//8Oa/cDVPvDGpnGVFSHNjSHg4P3nHBoAAgw88svNuEvISsDHA92\nr48yyw5I+CZkws89jpnVG/JP9zCrOAE+V8zorbkKzs9aW8TsLpQZDsZD+pCZ\nResvZzW9xX/938qphc+mEZvOtcum+FPNHXnMEWEks78tma9GrgYTU6bAa37P\ngUtweOMdUR+UBQ9BD4IePKQe3MIzBfpnYZ6RnI4VDKan41VZlKJABlE2XkvH\nQ1A6cWHLUG7r3T6RHGVk6fk9hDWmsl6L3ZZbfuVzySrAV9mM1ZIjkSruHSCc\nvdytJutnqLA7slayjAMIYH9ShL6JluiBuiIoBQHjU4PbWA5e0wURAnQrLO9+\nfGFCnXejo++Rbjg5zAETdor0TQA1mImkb9OCNaavAiDZAvPrMw4iGuLnUEEP\n6xje\r\n=ffAx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCt/Xf6kNUkZ0QRkij+SK1M2JdL56IdOCEiSSlawAM5PAIgFAqmnnPA6hs+kuA4g7gwsSmq+sRbHx/gxc0g3tVX5jI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.68_1573462786985_0.1103672920691472"},"_hasShrinkwrap":false},"0.10.10-alpha.69":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.69","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.69+18061a8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"18061a825e3f50b53e47ea2c12cf60e1bbaefd9d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.69","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1F3pSBzDESmbtTHGYrBk75ROe8rcEA3pX0Qx49CsvKVQaADqK7yIMhv/UIGrh7Bc67Plbaup5b9hyKnk+7dH3g==","shasum":"25d9f52882de73bcec98c10267199c0c72ed8348","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.69.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySRMCRA9TVsSAnZWagAAgDUP/0ZY4rHyS3nhjgIYS/GS\nwAcNbPhJfjleWTKe7F1OdaXyJRXHjPIMDhuXuX/KZO+08JS7+9lg8rWjVs5Y\nYeqZHg5al3USiohxSiqtzrjWCPYw4SKJJk6v4eiRDyqmSsL8Hd22PJUDPJQV\nG+iuSv5cSTUcScpszvEsTToR/L6bp3NqOkJfFGCK1/L8ZCSAkVS6nT+NpV7P\n20FbfnrRcU/RxeBKkaiWKXq3B03lzyvMXxQfzPPEvC9xS0bGYq03CfTA/c2I\nLq5UGTgdsDymNw/VD17d4FOHy05+aCflH+COc5TN4Q5xy2noRCnX7Pos2Dll\n/UzhnXQSUimg0Hk//QRya+YV1ywK9cqCfpiiGd7XvJA8DRWyVls5iq36cjpe\naAQvx+4RBe9gwQv+0DdBlA3n3HFnQ75/iyEbfDvq/4KRD7UTgx2sfn8Kx8a+\nBDL58yklwksUMJFbRMv3iBXiDThB73lrggk9QthiM0OLlLXwolMSnRm0c31z\ncE/dsciX10k+HPZNA+6JomvOQIHviVk7H1yClCqIb5Tk8ruLpnS0YZgDwbnr\nCEX/bwqf6UF2sbvCQsZR+Y0mxg3okz4gTGwqSWoViGwkl5SR/eaCirupWxCu\nFth/5BEAjg2BGq+Uui/CfaOq0Coj/gTa6MZkwkxlt5ZvCuHFVTyPGAnLK/P2\nufr1\r\n=N1SN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDftauO4zsALflWMbYkII1ZjVSo9cZJgqLPpxzItZlf2QIgNUrKeyaDGo5fHPD70LINLsYSIAptI4UfnmalLGIFXMk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.69_1573463116125_0.7174431451350816"},"_hasShrinkwrap":false},"0.10.10-alpha.70":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.70","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.70+aba2a3b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"aba2a3b433252e02f3f119fdd4ef720ff3a99438","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.70","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-vGZM7D4+xT8lnLhhiBlgSkeoXnKA8XsHjz7QT6Gl14ZNLWgSmObBK2ByX6G39whaYWojDhqZYsW/qWN+/z+rmQ==","shasum":"ad69fab0e2dab6ef8ccdc40691ea808d5d8d0d73","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.70.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySXmCRA9TVsSAnZWagAAqS4QAJtRm03sV94F8M2hOF98\nd++a4vEgoo0iwIJDEMms5BmUNnFpWMFD+N5GqxDEAkotNd8zCCI7QKRSrTOr\n8WNUv89zVyx2umqbLNtDDTPAPwjpNG+KX8kIffTZzhc3rjxeha+YE/3i6x/i\nyLIxOjfMBx+AGNUIaJP/pkthnnwnd43L1wWTbhnYs9baY5+0gmdZhZGfRVFO\nI3BtY6V4Obh5dwC1xghRzjJD8lYZIqrt3iDhZ7WbsH6yqhfmTNt7VLy5VylP\ngujVRu4j6pg6MR414f9ZlcRuzRXuGFDeuRxvAZOBtkHZtE4WURsp0L0F7Pe6\nvNLaSXGvSOQfrry3MWKG6nJMpUJF97lzqscrZu7ZT+JIPr2c3t/HdkFt78nn\njIH0NTCCjxUljKzVJgPi7c06bsYlO8CA2Tt0El96kfQDScOoN/HWxWTgI2Ue\nQq2vFhOfC9D81HgBu2XhsdBQcbvWadMjSQ1cDJjHWO9BbLX1fIMqro2C0+GC\nN6fqDjhn8L5RaJJQQdWOGAjb8P3V3a4f7hA/O1WWlS6WAXVY2LryWHveSU6Q\nPkORWYhas3YNV2OsRvz3PIAYw04D+06+8BzI0VLn8B5NBQMS0zu5DZrcE+dA\nstwR4yFf954dbP0YTWanuijj4St6mFj5fEYRdhHRkWcc1LpT4HD15zIR1ZNi\nqXTi\r\n=1zgc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEs5hFYLBcRgWSQGZvSClxTqXyyyPOUBjkc17yfaUjtrAiA9yFPqPA+WDu94vkbeUDd+Jck/BsCWeVRs7fqlxL5y7Q=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.70_1573463526284_0.1848753109775909"},"_hasShrinkwrap":false},"0.10.10-alpha.71":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.71","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.71+e60108a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e60108a9aa3b6d40db38aab8bc8c386d93c276bd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.71","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-vCxiXHrusv9hjyOaDOVwMJYgZyHncDOFIoDWQJpwGA6mLVIOimcfHDaCPKQgJOA8MbGzqYyjyrz5Je8LqiHQfg==","shasum":"a9ba9e0cdf2924cdaab7ec0a4aac5291ebf1daa6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.71.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySkDCRA9TVsSAnZWagAA+rUP/A7DaeA/zvu1L0oe3oRL\nlZQ3Se6TgF3sRaJIO9Tr1DXQSEZedVmCFCtVPBQaGbenw6bwPtXYnb9Yk3iZ\nOjnLPiCvDmqwyBMvtTmE02uJijc6BlAtsQhLufIxrts2EEZEN1Qyv5XE2EQF\nSz+WqetJvU+cy3Vj64qgroBTjRIz41R07YEVAyZ0mwFGmOPoOK9gP30qwCFZ\nrjjqsN1b6HOghueqJdrcZunGUXZ/sqq89MRNpNZ1YcdDIdGIxsMZvBrTafKP\nyEZOI6pTtLAPmHq0NGD9Zk3rsM7OIndEWtx/BEOmZoGfNwAz9fUTumIuVzc8\nQiiFVdqY4Q4mvsK+z1Xo765O6ndi+WwJEhMAMSBY1blwjgCEba0C72v1SFC7\nNBy513Dsj4SWMbgBOtVGJ4iucwZirlEMaDURjivYqa4QH0vs6nj7I3vvSFNJ\nXQPUecA4kzvi7Qbv0cC3ihJeL0fNNtmAjiPsOiOvuFdqnrOh9Rg4o5K9IONo\n2iSSQJH8panE+v5eex+1M7aH3kXT59ogBIcZ6mozEz617qmLYIJbPHiKNCZR\nfGEObTpHbZH6CZaNLMQoUwxC2ybZQfAAqeMgfF4EbK6WrXAurLhc9azXvadK\neMFrT0CUXJW8s55ftY15WhmuQjhdH5l4+Ge4L6astbSyQNdC5JhX4oS0sfw4\nUJOz\r\n=lcJa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDkc8XyYu6Q14RVXs2l1A9RmFmuTx52SV6O8DPu6Af7VAiAjWhL09cFh9D9clQF15Wcj8kC9YQYYxLGnCiXTwK1kvg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.71_1573464322835_0.9620768981051389"},"_hasShrinkwrap":false},"0.10.10-alpha.72":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.72","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.72+6f261bc"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6f261bc93f91be67305db2232b28c19b0a847e12","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.72","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-wkV27rkRa5d0V+s/x5PEgrhwV1blSAT+t7eHGiUJpEuWcfrlPvQG+pt/t6ze3d+U+UWMnj6wfnjvW4KZzITXdg==","shasum":"885b75a7a51da2acec825d3aa3a01edab7cfcf6a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.72.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySsMCRA9TVsSAnZWagAAwg8P/AnpuAk9svGbUk6vncIj\nWfp5RZJIwbRnLTlUeS2g3HlekrIW3HmtUoo+OWG16MSzpsn/G7ogaLchwhnS\nNzbX6yUyYaa19z/v6C15eLdmr94fq9UB9fowppdhBlrxMDmZVmjaYN8w5BHX\nNM0Pk/uVPdpb0IPdH9z3i9zMieRW5zIniYf9KNeut5ixcnNOOkUEygxL1tQL\n235/A7Y+4mMUnRIMUvA/539wVLTEZc3ZSOCFGe+ZHbaQICURaYBdur1HeAh2\nMETowg4wp8N5pbsfW4iOObCNWsVJj/iSy1kacfzbSILyWGiPx+LFl4dsMj8V\nxhJJo90ujWR0/ybENMh/IHbXUpIjerdqVUke8Ybjwzfh1CSTs81OdmmVv72I\nt7DpYL3TR/We6QqysHFRiVDAIP2ij/zc3x4YgaBpqf0O259bMEEanUrAb8Jn\n1F9xA+D0lEz+oz7+6el4CERvVQkoLi7m9G7AlrFl+gM6MxSCMT4LlGBTPQEI\n9mtX7ThnroKIZoWjaM5viJ0O1INhIkoMLNOF0gkuKgbLhr3Eeo5fIisM6soR\nWl91b56oAE55w1yfxHKSl03iLiavVIM12V/7vSCA+pp8U9pk8WTy21DtQ+Bz\nODSsmB5DkX2mU+VSfo8k4H3tw8oaenw6d0g7TuqX3begI8kf+ozGZ8WfO7KZ\nVtRB\r\n=2JEa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD4M1kgwTANptxI6KVkT9m9YhBtWE/lJTO+L5guehAVigIhALDjod4rbcO4UUj3v4mdVl/0NaGkvuYSnrMZi6XGymfW"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.72_1573464843951_0.6496204343663965"},"_hasShrinkwrap":false},"0.10.10-alpha.73":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.73","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.73+ece11da"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ece11da56f3fee8b7d3e4beb97cecdf9c521621b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.73","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-esq8Ghm/qjVGAuVVflusBkfDBFaM5i2szsrWtmRCk4f5Duv02nfNCqIppmt1TruPIh27YAyyXT0zHRWLbPuWiw==","shasum":"65a1705010e3e9683c4bdab5feb630fcf8fe9ae6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.73.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySxeCRA9TVsSAnZWagAAXToP/jFUc2m7QBvHEuHR9kB8\nr+b3uPgbjPLC/ZWl3hE9BkKy/BvK3Yu2g+nIHBDxwFAypiVcGmMENc4pnl0U\nj1D09qmFsvkJyuKmaneorMuv0dr0ahu4P07IJJ5sKfS2etrJ0We/5DdFCVWw\n7UR68zmtxz720ieIGRUC24Auyy063y4HSMevyIB7r+FofO8ihHrNWBgORkWK\ns1OiydbT46WFC/C1OkipRyC20gOGqr7PGosbNQ95Bh89n6CcTyyLWTkd5vyb\n+qZk1mwkUVY7lb7/nVYP0idZQUkgXC5OkP1yLJilORJmOmMAVLeHh3hiAyt1\n4yCmTBWyBZbhu8IS0VsCMYJSfGu0mRYOuqsSvVAX1MIKWUXt5jezFdQ8nU8L\ngLDdhCb/SJU0d1VZwOxwEWirod06NuuBjVDPcqYfq7VAPuO27khyeijqkqpc\nv8JJSE7Lg6xFjd5mcPQKIYkWROy2vJjXfJWmm0yUkote975Xh2NVChdyEb6u\nsAOVjwXXNY5bLy772J/jv+tV3ZtHuolnvbeTMskMR7BMgV9XXsKZ3VmnJjkU\nyadFxCzE1pS0cz3JVLafTiwvK8Wl42Drw1wyR33m1ifDjzF9DI1o4jSAgbt/\nHiOxK9NWU5gv88/zMnQH9Qny+7Xz4B603tmkCu9VaEpPQYEx4Sx6XjMYbIUo\nqH6a\r\n=7XJ8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDNbIJapVMgMLyeGlvWVQgf+h3Ej7ZHyT1c7jR7zKA+fwIgKjTUJhZ0igrRnJRl4SeZ7OAjypBmaBffKjH5iL4gl8w="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.73_1573465182344_0.0454411479370338"},"_hasShrinkwrap":false},"0.10.10-alpha.74":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.74","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.74+a22ff0a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a22ff0a356bb0ca019e9be5fdc8c5644284d7cf7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.74","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-9Feo5j6xzbFxRhPSTXDiXnBqORzxsvuQcOhskN//DSEZ6zP0KTLNlz8ewD+PL31t2YMopLmS612faWPYpVvwYQ==","shasum":"23f13affe3361cc65aa091d45c1ec1357d5fd93e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.74.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdySyvCRA9TVsSAnZWagAAvhEP/jCQbr4sqnxMK0/tAE1h\nbUCej3HtPWosGUm5XcL+SSTJ1s3ooU/D8inye1+FRgkReIdLroMT10twYpVo\nzNbZwZ66s1GKdoiS2ENzLf+cYE3e1Nd74Z4AXqrKCXzWuPiGnfGFXfPNMBN6\nWM+3fj0VeUvbD7yh6fxfcBIRAwm//QTS6QBiUHLLsi17CTLq6b0M0EjtGDJP\nyovWGyY8Y88SN7ks72J2ljFceFJXsw0X4kZ5PrdrJWitQnyktMKjJPbP/IO5\nHh04A3AL+VIb9xWpWF7B18u1Bssa2s4F0LmOf4sspBvoP+fAKKuFr/8TE2Y8\nn9ylNY0Msqs+SOqjNhcohC5TSNCrzPWHg9fi8cyl7QcWuh1eXTr4RUAkS04G\nhJ/ZqS56M+8Sq6B/+FNe8v+nU/SrQLusw/FACbTCVnbCZ0tv47ou1xgEqFAB\nq47hRgCZL+eUHFegZnOsMrm2zs+ghlgTmjwmRJ2tAnu+FHW2QTLO2aeZv6XS\nh+hSTRwiP4w90XdfzHqwXfy/GNPySC8DA4x8iB4MWTdM254rT6LQGMB6XJao\nN91qz4+KD2q+VyRGmCyl8Il5zVuoJTdWwUnympEwlM3757EmkzGCFLJjGML9\nIqSCj8KpUnxth4Aw+N1wwF1SqKsWoOCNMPx7FSsKMPKuaQWMXY831Q0rqHUS\nvRm1\r\n=rBTU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDe20zRqy+yNVod27Xh9eWp6nm3rYtKET2ylnRPfT7I4QIgekxtPLnRwvcI7ktN+4EhVXdeSZ7dEHCqA0tHfGID0tQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.74_1573465262620_0.8604385153442775"},"_hasShrinkwrap":false},"0.10.10-alpha.75":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.75","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.75+0a66b84"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0a66b846315914555e96e13a0ffe7aa6b3298f33","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.75","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-NubzJBLQwg9lruBcNMwLuuuSI4VqbghmAxoMTcMcWxZi1/6yPYyMkzyHgtdlK0rA21B4fLY00NDW/23VwFOEUg==","shasum":"73a4e49b3eb78dd0b2d616c8d6765e4ab21f6468","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.75.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyS+wCRA9TVsSAnZWagAApRMP/1w+IZflkzKL6ez1xltH\n1rS/cY05S0tzBDY4NGN1qna+uesBdbePGo37N7Q+qidyEfdgAVFtNRIOHrc8\natPAUlWkC7ypc04P9qrmJSVHUEtuBVTzoWECW0CTn/d9ZPEKS7o/T6y5Ctj9\ntRtaqKxVlX8EKg+coYWmWGFmGNnWVyNWPNm1h0hlSZt+oPASMOnxoopLYbA9\nkcqPCv0pwgYjwaHJyMC29yQ+YKW8sBVMXRudAAMC16yMUMPIC2eDJZzRCs7/\nZptR4w9gCEs2bGzADAhzxZQbHE7XLbVk4wzBF8jvf/hSqFH9B17iTmIWfyyk\n7KdCtu0eZPc/6VXo5gpyoqaKGZrzrREMGq2AEtr+d3ni5Rx8dfPqYuJkl61m\nPbAY2c9vSDtqZcOQRc155Nm18H8kbsijE2PCCUPoUJHSHbSRRcvj0giHTfnZ\nJgD+st+Wnui9wtM78bvtqK75aPaQsJ9pwWootAaQFdVPfpB6til4JUYG4mJE\nVtfgi0m1jZtEBjEQVMfa0rIr/qaeg0/xyhRdpy9MQy2PndxrAAYR606iILUG\ndERYxjAe77H6jYkNaZdXQkvjdpjvGcS14wF4xlgPWZ1R5vW2wzCtuCgVEADc\nxp5i/Yd4vbbyIVkpPDF4aS7ZYq57vrwVNOD0FO5bN9fQAYFKRJ04lJLxJvRt\nPoTx\r\n=n52m\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCrDso/SM8x1Hbj4HxKjPVPkRm8rSiTbKas7Sv9RWZuyQIhALB+MLFgO/OaW9Z76rI8pajZsOlviTRUBp0gJqHj4Wzy"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.75_1573466031788_0.08560899959691715"},"_hasShrinkwrap":false},"0.10.10-alpha.76":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.76","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.76+706979d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"706979d23c7503fecda88d6e491cd264c68cb54c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.76","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Ss+6ASl69Xtzcc2EToM9Ple9G7NKnYQNfTYhUfpq5GHOpomGcDK/HPhlo8+qi2yj9Memycp4yAPCFn/eObosxg==","shasum":"cc936d10671217c256525dfd4f054b35f2adcce0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.76.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTEACRA9TVsSAnZWagAAKG4P/j3mU6HhjbQYlm6t6CzS\n0lvam/9BlHhpAN+9Mf5h/mYKO1C0NkX9u85TFfHsX6BT7lFe1seRg5nEaAp2\n1f+s5DZuiJe+1HMcSKCHwIsVW153vfANX7HMwxOaQl75C25js1KCUFovQxWu\nRkl54fkxPlZ5Lvt3KBJepKs/kB2ntsItRcW0ih4VjOxDwNxle/uiMLwD79nF\noi2S6TaiKeUq5WJSDOjNjzA9BWBjjKiHWG3oqvA3Q/cAf8euEfqh9T5e2UBO\nmmqVwkMgKddA5Z6wZyazUUos5vBPbmKIMJCddrwnzF7tcAfiN+GG7WAFgUMM\nj17UVa933Rt5q8S+nnn/4vnquWJupPsFfxDwx1X9NlJ49GWZlkBQSTF1XFO5\nlmP4C90tVgR8efBtL4A7q+96pX6+Opd7eyEGBD+oBqBBHpfKaHAPjW6nRtS3\nmgkePb7jO6sHH22bqQBXwSyHSHwi/lfTMNd4RPQi3RvOyUfKsWtxv2xnI40s\n54nXYI9fib3zBZWW4yeR0vLuXMogczlzCYrbmJYy4UiYWzCR+zv4e+J4NRqG\nprT6LOsTY1TJjmqlygJybW0IRgZcpLQyrsA5yfXokFW+tt70v4fcGOeSK6iZ\n5u3CVYizoUDFdX2z9nF4ySZGBiCCINe1qnqhHaW6wreahiAQ3LQyDjYaC/gg\nz5pi\r\n=6mJ3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGsMMaAia9Cde0/sFrMAhQRWxPMKBAYWRTEBx7t8SAb5AiEAnuUEFTarFNWhTekFO8acbYnwR0GFvxcSMBWQBQCmQqQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.76_1573466367718_0.9898560327586616"},"_hasShrinkwrap":false},"0.10.10-alpha.77":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.77","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.77+6e82a81"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6e82a81881518cfbb36c3055def53830aeb1470f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.77","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Urk2TJs4Mrx4mTjGzfQtIH/5DmJ48HBPUcGE/p/Nnw4nO/ghHqvNEYo0PkXd+ZLisxm6eXcMhKDQalcfwuKF1g==","shasum":"834e0e8ba64f9fcb70a1c00784ebcfd215596d28","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.77.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTMoCRA9TVsSAnZWagAA5P8P/12QmXTrPutT/O+pJikL\ngd6isjbg0xwBiI5D/clmBSVBMfeP65SN7rroeWgG8AoTVNU9RgzFGeSFg83N\nJa0hs0Z+CSgmhqODpHh8rElnRcrKWFYae5IkriwSpFH9TaNAZ/l5T+AmzQol\n0HtMsvHv/SunynDbPnPek6ofY9IdOfEk4W3EbiiUyP2TBNzeSYGsZDkgYjZA\nqlT4Xur1L6dIuj8buBpEd1Cw2jbrT99ThQ28DJrrm8ff6z76c5IcGtY+5uzO\nFJ8G0Pegi00a3EI0evAubQEYIazk2+ibd3ukrKxDB42hrYGh4gp2V28Hx0aJ\nBR1ruWdeydYzOe6LRVYT9gBSHR1RS5tw6Y68gZ2ociRKevlLN9pwD+nbxQdo\nraiPfm3z9xCCtxFUh+YGpOEquJyvuWMV2c0JAhJLkrFjQokrYCtphR0yOwwl\nGJwiasAZb3OJcG5a0ohcB4HH2DDvWuN/fVoud6kOWnSDu9MA5BQuuFdQ0Xfe\nRJX2xDT4M68cqbXutkTa5wui2Vsul6miSOi8/fGVe7DJkd6CyuPdlSfi4T/D\nJzr+xlXovjr1ES+IwEmVwwzq9sOZPbtk0ItkPX7cm6RuSfNR7DWNOZgOIFyj\n6ajvRYR5YZSqVSkoW7p8xUy5oy+2Z/mq8K8O2w2lGqopb/2WiD18qHwlI67E\nTzCi\r\n=M8c1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCXjRFuzYscg7JpRFchKq2CI+CZaQ2yeKFQokdL2e4YFQIhAPR0TkpPHH25ceo6V/Aucf0oo1DuSfD1MW4a3XZJvuga"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.77_1573466919796_0.34530943799670477"},"_hasShrinkwrap":false},"0.10.10-alpha.78":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.78","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.78+2f04cf3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2f04cf32d71c5bf6a7be97414ff2ce0ec1e17b10","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.78","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-iQkGxzsA1Ef1Hzd9IYyWRuF3l/3L/MeIqrTpx4JeeyRnE4t3WlVuDq97cvi9O9qei9ZxLRku6FeAZ1nfAhhZmQ==","shasum":"e69e8ae9018d778bfd38b561a465470c6641247a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.78.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTOfCRA9TVsSAnZWagAAO9sP/05kRs4AZsLZpXtXxmdv\nKG3MPhH7jFONMy/IB51+vYYnmDh/liygBjf7q3RI9jOgFVd31gE3c1tqGtJf\nBSKTGrU7BP2DS6ygQDc0IKPJ22q2bU/M5sIJt5Nf26+PXwq/QiaV+1CZ3aLr\nLwTlmPzLTUlcoZmiY1BjiNDe206drJCeP2rJsIsxqGlroHlC8a5hmpsLpGdw\nhW0LF0rew9k9rSExuWuy3kx5Hwp9ooQJT/mF5kGzp1WayKhYKvLdvqE9jsG0\nGsAYF92KuwCOZX2bASxZGbnM8opXJLbaCaNALhkr4V2Es2Fc8MNE/YA1s51d\nPZm8QyjSpCllWCWb43Gv53DN2YhBzzfzt1fmj0Mn5fcsywT1NhfVNxPvjJm4\nUWVFtKy3lPPdFgeWSl3ffCK0wvvG5bvOL47JanVmfeMku74Q8OkBJ0Ue3bm2\nZM77JhqWeVraE54gjWqpQsm9J2kEGm2ChCo7mWySbEbFldx+YB8KApOXTxbb\nOu54LZyU9ZIdMuPgq/8j/PvRn53OrxK1fdblsyjuFbQgqE2E3NG2AhY+glJt\nsgV/OnNRkkP1c6AYXzKTFL8im+/qLRFVuZFWfzKvKySRJoobwLw+Qu6fHeKB\njsBo6IrTGpSn4lPATRlfbB1eGE5mQJU/TOIogi/bdjV3PZ6yJmqlylJZHVuU\nrj3f\r\n=2AUn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDrCSKspbiz7MpYt4YEUVe3S/vaFQUS+AV3D8zyu9MNaAIhAOt20webZz+WUJoEgBBiWsKCbr/DMGJR2HotqNgAYFjt"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.78_1573467039254_0.6886644312699122"},"_hasShrinkwrap":false},"0.10.10-alpha.79":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.79","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.79+09c4b00"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"09c4b00f7c6c48ac5efed056096385da080f5b73","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.79","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-zDKqjspgB6FwFEPHzRMNLpZW7a2riZ3J7koMWBPTWJH8jcqyWQwfBAoxc2j8XLtraie6Tg+DDjTe4y6sqlM5mw==","shasum":"c421fe70fd59924a1fe886dce6178faf9dc09914","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.79.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTQWCRA9TVsSAnZWagAAgnEQAIHmM4gL19Gn3No4vCXh\nL5Ov9kEHJaA5NM/aVE4LcrCMNgZ2X5KQNtNw+P0vlcDtxKyw9pQaNo2g1cWb\n+fbwGWYadsFhg6d51YbY/TMy2yslrIVMF/5FSMGdvIA9CAJJ7aHLWF/ah7ni\nqL0RRcBHsFF9exM3xGEVUe6IO/RdP24JTFgboqjhEAYrT9Y7QIiAxyWyg1wH\nSALgR1kvtRiwSOPVfk+riWDwseOL8WJo/jtsF0ytTFLRcWt4LQtRYVUU8h3F\nHxRLz/LzIA3Nm9EjnM0+D8SFozdNQfjOknYdW6n0gSWLpSMhxzSkbzOIAXKR\nBB8PsLx3AUBddsS+1baabG2JmlR2Ft1czear+EZUGo3VyWy9io4m7w6UnM51\nMD6bZdMKUCipKdaLxIAzMZtU9tbXDPzSI12QNhNqZqp2ZbkTBNBGtBg010eB\nuV0HETjL+JtTDHGXv05T4PokiDm4lCAwKIqptLsnarW4zIl9aAhHKoWQFTbY\nVm7RT2Mf09QWbgy/XW4B+PTwMVovP9piocO9AwCZeA9Pfey+t2kWL64/iUxn\nUuRn7GZOs8g6aowgZHUMuTnl6//wuY288AhjfTCo/lX6Ystwxc00yw4zIgBt\nXN4Mhjf5LDhEcmt3jGNXSrsJNKEdCJBSXf1couoEenhl2El6uY1qqD/VeZ9u\n8G62\r\n=Bnfa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID77fy3zkUuyom/kkl+F3b6ZlOPrzFpzxUBDi+D6jpZTAiABU4Z4T1+eZQWi9kJxyonKb+9+6BwfC18ywFIl4ClQcA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.79_1573467157587_0.8452201046783785"},"_hasShrinkwrap":false},"0.10.10-alpha.80":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.80","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.80+54311b7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"54311b71826b69998237f5604447906b845c8ff9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.80","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-9P1lvcabUrNqarid+uvJyXkaEScxO5DKXs2SWAJTFKj6AJ7ircYz/BJPS+ZTzfxxz9oHQqhFAgN/iH2oXbvd8A==","shasum":"8e3670cb9995f0d278b9c06147d5acbed426e880","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.80.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTTxCRA9TVsSAnZWagAA+14P+wTHRU4wRnB6UjBVdiHO\nt80z/rwzfrnWkfah/EQeRnsJHZv4XhGB83BdI8MQNh8maIDmsuJaKj6hWI5W\njklDbeueerN7STKFOcF1x1jTZ+VEXyXPEdRJP1BOFgx8jXLK3mq7ErFWaDBI\nqK2u4UyzPoWJ5C8uK8sbpyuU4cTeffJk7B572PtDqs8gz/a7iaEfobnxe7bc\no1Juwicm53w2hABvMF+uVm0BnufoDNZoVIsryHd3OM/ln8QOsfbrdkFaeVUb\n+INOI1I6dhv+Aqbm5WK8qoE/pjfDx3eZ9dhoQxf//cW7tJHK855/mK7+i9MU\n3IJJP4jVi2h0Qga01LWGQKhUWt2P+a6yo9MDRKo2rQfpVYJCgzEJYEBKG/mf\ne3OlUIK5txCA89sWDD7SJAXBGPIHLI0EFYTOsQBy5b7GTQE6/LwEiBehiLS6\nbYInms9vpq7UZtiiWWNgHSH84QoVfQsJqK/uZ9WnQTSv6xRhE6pufvK3GLmo\nZ4Rt/FxCLdwwHnalexYQjvaFmn4CZU6QNCPnBp0bDjDW9k0yQPCMddr9UYRj\ntO2u9ayIdmUBX6S4IatkB+EJjK4MNIfNtKl4NNFkUg75rOtF6PcC7A3HIhKb\nI6AWlYwjXFYd0b7lCdlyqnHCi3WZtF8UReqqm6v31/cJGFj1qZ5i6rfmEXwS\ndyyS\r\n=545c\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCc2vPonUSG18ltrFW4mLQGvm3EB+qfwVsYfwRHmG2VnwIgIYMJFCbiaCW6UDAtO3BCwX+qKg6PJGSeByf09pDWMhs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.80_1573467377255_0.8654088267775166"},"_hasShrinkwrap":false},"0.10.10-alpha.81":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.81","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.81+f114bcf"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f114bcfbab0146813f7b22486d700111fd7594a0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.81","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-+o7VYg9JXMQ/6EOGGW6lZP0Pcpp5uCMyTZZkH7RClmCTNJTNSTVcOzi9H5+SePn0BRB7F2RVP+IhZuTz2l2m9w==","shasum":"51e7d9652787fe004b26c4a9373bc3c0264b844b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.81.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTZJCRA9TVsSAnZWagAAHsAP/0WgTZsdDa6LpW9FHJDL\nhWOm5z+ZFnseQ6myU7kgjcgO0KWFe/ya6PdgjJM1Q20NYFmvs7AfGw3sl6RR\nFM81M87RXRC0ShEpz/2r2lLIxnPEimDs5+UM/+/vrscHTN+r2kJf88GSCPDC\nrPQ/YMhrrznGeODsAx3GOo6+pLyHr4Lo1NvJZyWsRhJbsIF/au/ZgPed6VkT\n7D30RdXG3EAlLgLSnbrS08fz8HEtjN4Ww4qzPPf5wqULt4FirrWOkmBYPnIo\n5gLQEcCl1gRhQC0YvGoxyP6NAiMDvvbB7wRKbR6utCIm2ItaE5yJGkAOpDhD\nPWxWqhx30vb4vl9Q+pXaQ16NNWfvcJ1BFvRMhoRiPmP7vxwclh1Esl01zXdf\n5iAo2lJjgjjXQdZnQJp47LOk4icL2TKomg++UH2GnNpOjjGnWvHBvSO/B1CR\noN62KFGeqkSDakDMphRpeeqbbgHQ9uNSp/yYMaLJgq7EYwAM90m7Ilpri5PK\n///URkLux1CwUFrgWBQeFt1SyAvdzuJP06XF42P4N/8lxJ0WmiVfj7OzO6JF\nawQ72BzpXaBu+6dibpF8g6AoDM5oHdeuiveDLPQsRCcC+AWsTR14td0wLfY1\nZIUqCwlca9nhFWajbXdgGsGTRi83upksIwVtMvLDRkXJja3hL1KSmMMJwKRw\n+Ih1\r\n=vbEQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIERsaRp0LaPeW8ym7eGGCufSJi0BDXnSdC8ANV/NWktaAiArN4CwJYcQEpeod5lReULPAxfu6Fn8u8UIZ+J/CrBE+Q=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.81_1573467720731_0.7367321310473034"},"_hasShrinkwrap":false},"0.10.10-alpha.82":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.82","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.82+0755be2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0755be2eddc81fe877e8107ec97cad01e2d3412f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.82","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0nNjRg4syY0FrkvW7gIyXiyghPSxh6QME6YbZ2GFCs+DHJW2KfgBALmhQX+oy2BO14lQQHS6Tul4zPFY4KRqYg==","shasum":"5db766f227d4c90f73a060831c6c5717a669597e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.82.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTc6CRA9TVsSAnZWagAAkzcP/izhMo9fP26RyRwlVxOq\nihqhVS40AjNaN3d7YGN//Ku0OQ4/O6iV+gqmxx2Kc3zZZX0Ef7OGphn4Sp/4\ndlQtxkwCvqk81DRhShKSiXzbcZcr2sqGNRgRTtZXue7qzYa7FhSYOkSv1Age\naDJ4/iAOwgcb3XMaeX4UoSifxTGFGq4wcX/TES4Au8ZYT2DIg+mjiKVCk8yd\n0xdBceeVs1ZT7Om68UyKaMLDwweGqEl39KwqOmvDmhRLk3UhEr6lhvgTLSjE\nwkIT+/r1AIwFIncFMRxJ4q4ZfSAgUp3ZVLnuC077kSAcqF5+pWS7HPedxiXv\nwIuwUClZwii6vcGP3DdVYRP1NMbrhFSbepMC35QM6msmDvshX+ra4RswWmwe\nXp8PfmJXj+p7PaYmA0fWmpSqc16xMsGuchomyk3XDnOoglgPvpCpnr+wYgtf\nOF6GteHGBonBcW2fpVNH+YbSH5aeN6YCVCHgU8LYPNHi9tJd72W0KDEsAWnB\negyfHCgSeEMIPBKSDEJ88oUJzq4SHOBXz3ApuHHtc64LKDLU+tT4KzA9B4HP\nL9bw7KQJx8+hBB2jlAQP6biWjRHUFBMzkhKkL+lnz/srQ6E0wH6qWO/UZ+E0\nfdkcUjf03SKyokpupejxE5qmrgCkjlg3sQnPnqPlpukA88T6MjTYaJAwU0It\nvKcs\r\n=HR48\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIB9vqhqSgvq3Mo8oUMKmqHo76zuVsHN8BJRrmBWr5hI/AiA3eA+vDRoz4J0fgsTbKDT/tdMo4roFYmTdqg66v3ki+w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.82_1573467962560_0.3909818364771589"},"_hasShrinkwrap":false},"0.10.10-alpha.83":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.83","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.83+4fd4741"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4fd47417d397e1a2e8ab2a587207e3037baecf34","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.83","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-5ldu8Tz0SmxOFOT9NQd4OHrZ/N/me0LAB+NbYCY40co0ScE2vu5LR9qQHl5sK76vHmZQxNTlQnVNdHAzSLhoeQ==","shasum":"c28e3dfd5163ef68f8ec1dc5b70400db09262658","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.83.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTgECRA9TVsSAnZWagAAOe8P/ih/j6csQo2Coww5z3dV\naLx7W5NFJ0saXaVtPuI4MbbiTvsop7uxofNVtA6myk6vBH8pVlkZUHG9AAhi\naly1LRrTIU89XOb3+rDGamw+RPpZbXRFhffLgK3/kcG2E4gALhjb4TDiq4N/\n/WUalb0BV7TqSSLpxFAPhi7ZK681OAEfLGokWaSfkprBi80JmG1DAG73Obx8\nBBrx4ILyGVdhS50AV00JxyETzH0l1Lj/VbxTI+xf5g/i6QyBE2cMOdEYex/k\n8rz6+zqAqNvdtPQX9MK7aYG4UlULmonYyscIuyX/Woain/Q0C1Qubrv/ioNS\nXWhkrpk2ZCLnno3dYOBm/Tl+AklG+q/9FWqiN/B2oLvdIv29vpzwcW9hfjJ3\njsLqVdX2k9c0ghhMCAwkYd+7kTkBk/ZT2tl3QKn1oz4LoivajfQRh5Y4oXII\nR6nX3vfVodvQ3+uHXzLwFR6IxepNh4AkfUTvRPlsemL7n3XbBzZ32KcARLl5\nrmk3fd39OxwThgjRwS9C7FYsMRJL3kz0KyQdVf0w9MyDFYnbj0Xy6yuB4Tk0\nvtmd0B0Wjra9szXcNcvYZ8pDIB/4sEz1nuXyDyrkzzYXDDJjziDDS+2ywUEj\nuYGAL0FVDubCPE24zdKNBRKJ2PFmcdZ6lzL2G+jQYjdgTgoFH7ScKuPpq8up\nBwoO\r\n=8OKL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDdVuuMp4i9KQoyaZKqpFpHc1Fpn1EiFDI0m5mpAQD09gIhAO8rwwBF55qfe+0PYYutWwj3k2N8y7fQwBMfKHliNaVQ"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.83_1573468164140_0.9011540229857928"},"_hasShrinkwrap":false},"0.10.10-alpha.84":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.84","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.84+a6a181a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a6a181ae9997b3afb0d30083ea7dfb06a28359b6","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.84","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-soo2Sl+1wlrh7nt3DAEkIweoPxAmgKj99OuIKoqgE5ikvwLam3fxbNnKwBNLC272shrk05BGpgns0/GMQI9toQ==","shasum":"f9e33b3a6e7291329226a76e110ccc77e2f37bdf","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.84.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTlACRA9TVsSAnZWagAA0mkP/00Tp2vQQuFOPJ6sgH5L\nEX1ttRGFO3v88QgMcGh0jZ2WB9cwMUTyfmAHJNcnhU7PbWVK7Wqa8NOLMO+a\nikdBee0OrIzQvoTz1lIJ23AEpWq/LgTBd9jn7vdQuXd6s+8G9ZdKt7Duf2/s\nVl8tquYBbLH9MlM4BAE7ziMiy449ATKMdjKu9zK57ebKaExPJVquZXLYxj+v\nvzAaytgnCPQt90oKNSw2RpJnp5pt7IogNYfIPSpowYrUZGq0PHPBva96WzXi\nmQYs0H0WAlQNTemnPPHm2CmDifbFsjUEkIUckKaKLPeJgESRUKXxm7ZlgQR9\nUL9I8AsPmEH2LTtd+qezz6pD3X0ztqumGlnDVU4OQWoSLNQjZT6wkNLlcnbu\nojtWX65P701tbuvgXM+VDRGwFsCW7oRMjBFyKputN5+Q1jPvAsrey6JrubAD\nFQjKpUYtg3b/oBXUQ6T6EfsVJWpb6Do6JBzVDxmnEVXs2wjNO56EoVSaclDB\nfciVV4Cfj8bL/F2NcU5XDIBvH1jumtj191cVTvDSchl6CJO82vr4xNgGYfbP\n5xUsyjaOPIrUaxXcFbjckgzrnRtWRIdUfWqjSmZ7ANkAbwpiZ86s572qtU67\nX6PxlcUifx4yX7Xu9vD8IiDY45L5SBC2Lfc7Z+++Tri+XPIL8xQymZDh0uYz\n1bsI\r\n=+vsy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDyb+MH6myp4sxEJEfi9Jr7vTZ5N7DJEstJ8shxFV6HPgIhAO/so/FoyLV0THtJ1S4uKkWXFmquon26X7hxlfYIjbbb"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.84_1573468480481_0.8352766309589343"},"_hasShrinkwrap":false},"0.10.10-alpha.85":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.85","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.85+d5d11da"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d5d11daf7022b20816ee014f026d058fcf8401e0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.85","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-6iCFIdJQ9GEqKhU7f2vg2F8xOkZmKlobTWiWM15bXEc8NBFcctZHSJz4PYInu5IhvkwS5k09Rpfpg5aEuhUqjg==","shasum":"c8f858a95b2d3e28c1196deeda359f1fae4b5584","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.85.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTmmCRA9TVsSAnZWagAAFr0P/270cGTckjQRMw50N499\nZQ7/KXU5OLCoyaVAbVnViyj6yzOyT1lCfPdMO3GCDKszK49SUc3DoRVfhFz3\nTMrFCVtAfAE6J9R4lBtpg6JfKiVOIb3sn97TZiUoUgfRQev6LgAdkt0BHzKO\niWYl2RVPs8wLKvW8EvgKo074GUCoPmr6NMkyaWKGJoUpTPset+99D7HUlVm+\nVZArNjPhCkNps73mTh7xofDO0ReRC0l5vUfyX/kMsz7bSCame2qixetvsVUd\nF0FkkCpY1sBWBFn46ysnyTnc8kzqjskXFe/iesT3umY9xuZP1fkTCJfB+Dp9\nuBle4YF0B0ivH0+gSImSwtnzui+FPQqlhnvV3QuuOg221yG+yVbrKOJb4qHz\nCGpNnc1IBwBgZXGwNBehQC6pbt+M210KV51JhSrr41Dr84Z0++QXx/4YE5wp\nMYFv6qtqVG8T7O4pUcaFULVo0IMonwUBAIQOqSNDtfbloNnImH4xT857h7p3\nM1zBd0j6PLobqLlb3M54rshMHya7BSgSUNc2eZLt/dSZ0LKZ0jM+nHzQ5ra/\nNfFFt0bRObnlHFSJP+s66S6HOF14hd7tJLuhmFZ950ktofeqFhIP8t03XHat\naihzKFA/kVmtvDqlOFmn5N6X/KYG6O0ZXD8AhJ8c/JyCnIrPO+yjDws4q8xJ\nC7VM\r\n=E5YN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCwFOFPN6cIbAQ5AjKZL2vb9CSSpr6jHx8NTPctbdZ6SQIhAOXWV+Pao1TpiU72mwtSsNM4lGGvffj2HWxBpZW2t5xo"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.85_1573468581626_0.4232520212943782"},"_hasShrinkwrap":false},"0.10.10-alpha.86":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.86","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.86+22c53c6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"22c53c6bcf5ebdcb80fcd325a7869efe88bf9417","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.86","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1WyaKEjNXDMTWy12HTh4jNQHgHAox6Rjh0pY94R9cS+fx4bM+tSqyLt76X8+NOYww96vmWxbx5jGh0djhBFMZg==","shasum":"005061d5a65af8bcb51453669b30e0673b7510ad","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.86.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTo5CRA9TVsSAnZWagAAz2gP+QH40WSKl4qQUe/dijkZ\n8af5OFx0oIc+mP+MN7XaahdecSV0go6iERu3H7z4j72ugM4rcUqz/f00YJX1\nwMl3FZ/cfUv7zZLgPh6nTt70LgkpZ/Cq4j2H1kiNOU6tbM8yqjOlP3LB6eTp\nM4an968eEOqSHZTznhqIlQ3F9BvHJzulCwv9BlTJm34zsyF2R48I+hzfPMFb\naLXBAcjrSwb3Kw941Ph2mIT9hQxt5JdLHEV8LP6sUohinMKqSVgjccpEES6l\n4mwYQvy4cxky4Hk8ZHNbxxHHzqmteRL1lgRJqnLLmAhbmy264MU3CDv0lJ51\nwjH5UPY/DoHdK5tqtlbvgTkF7p4QF85nQowyYHjTCANghTngSQoIl/ORqCBe\nRbvZ/ina9fnH+GEMWqWV+VJ0ijf+INwC7pK2fQWxohZtAGgUdQ18PRMgqaqF\nFlEJqv+Xhnf+f/6EleyqgYmXEOoYxXEv+ltCK0/ty6CJ1RWHKaLSVDXnFRaL\nfHY1hWKSR//dPYnxDH1RpsrovL4zKSvWNqIOQXe5kR4z99liId+gCH+aJmjr\n+lKyZqLWajXMKq9MTZPbcYfMPJrr5bptIIveXmnSOpHu5rYx4IUT6+aH6nJQ\nwA9FDd85c3OLK5qdPXeLIgJM9mDyLYqzPBFwHjJdTDsB2rx8jW10FyTBO79P\npluN\r\n=sxV8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBoqh3wIIKJtT6hzYq09hk00O8kUq30UqbDBKNpm4yMRAiAh0eHDXH5Gjoy2uzJFgWyAEfFjISvK6NxvF0U16/6aMA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.86_1573468728611_0.011812343391560676"},"_hasShrinkwrap":false},"0.10.10-alpha.87":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.87","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.87+5df773f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5df773f74d53bcfc6ae5ce49145c7bffb54fc548","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.87","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-6T063w0aK/KacA6y2MLwSD3AteD/dp4mmicvWoKfwzedqYj7guFMxFViJ4ikV9yOMbbsZM72cizOtSFQYg7tKQ==","shasum":"f9d69814c83d07c4a3bbdffa57298d676e0b862c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.87.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTsbCRA9TVsSAnZWagAAhDIP/jN0DmsHgGxOmxygpApi\n3xwgwA1RVHuLmuqu1OnZ8+3KHz2vL9Y60HrJeJk0ygH0mqTfulYSKXcXSS+w\nopWJ9/j3A+ExODxC8BPda5Ei2V61OvPkVcDzlH+KYvlXYjZrZDdKVgrk02i+\n+43po1/6bddCvStTTAnmx+saG6aVvJ+pQ70Huqt61sV0UvLcQLwf+6IkuKcy\nGtzamJxm494NntPeHQ3bAh6GolTGm2GRcb1Z8SwPv9yD0woHH8RG6MvXbv5y\nuaJwGMOCLe1FfVFPM8hGy3qnfCmlIVrSIsKSDu0yHX9xFT7a62igaktjAPDj\n9jExyXXrqJR+ZHi2J/GhddS+LGMII5Qja7cilxdpkI1y2vyjOXouoJDyxMXC\nevDGgMP3hfKdxo/FA2wwQzNyO8+G26T5JbCl8JbbmRl/rdSMSoe6ICqI/72M\nOoOK6Cg68sccuVXtOBt//gE0ySZDNASrl7gOnpBBSn8Av3YQT82CljRFW8c1\ngZoNC8Jm4r73CkU0wu4hoqesdMWncD3LpYpzGYjHPql0SFU93DN8rvMIchu4\nsy8c3O+ffZz+tRx3Pn7n+rBwi9G7gVukajvgdJ8DPSaQGaTIsiWn9iK4oWax\n5DumF7QjDwjdXPFglSBjLRpmRCg2TFDPfjzg4cKIS9LuFn+8AtWv7d77TM8P\nDggw\r\n=G5Qm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCXLvAHuRIlF+hvdeX8q09IznyMutRNNNECrfchheEBMgIhAImkmZNBStrm4ncu9IxufAmoZvizHQ3ogPIMfLC96ut9"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.87_1573468955005_0.7377733253147183"},"_hasShrinkwrap":false},"0.10.10-alpha.88":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.88","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.88+9314a59"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9314a590b78dccf92fac44a7da971cad77e5bde6","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.88","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-yKuvJx43yZTL0dM27YIZgeRuD8n7wbgcsdEIUL3jw0I4ZO7da75jCZOAihUzjtf+yIX2/gh6VOwpB8I27+U7SA==","shasum":"aeb20e7365d68d2ff3cc30da7e6ad61f2d64efda","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.88.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTu+CRA9TVsSAnZWagAAMFEP/A77o5WHLWi94S1MuoCW\nhLScOa04VzuDyxp5JTmGpu3oTepBeRhc1DcyFcYtt9ymX2iLDpxJp6dy+N6s\niM2mGQii2oVd/uSFYHclQsu5ZjwJaEBpklNaO9taeT32jujJ8DPXe/HZZ3ZS\ng21IyoK7hMOcdTeYrzW7QgWgMyrnn8BwJzh01oabCgGD1EV/OHRLdVVU3t0p\nyp/VNdmYQpyZ4mN+D7JQaMaUsHd4jiwQXybfHJXujS9R8ZQhdQr222GgTSJv\nC43N5/GYHfvA2uws+zH5pbFpAPTkom7XfKGYGuTYps2DJjm4RHYPHj8aoLAf\nNrFA+UCztkYNclVbkkyxxaYSTLZirobCQiKolJvZWGboO93UInWlJBCR0S4E\nfP5bUvY0E8GS/HCrTfkmXQS17aJAlRSiesjJoF/D9Zvr7D2WaU7o8/Wj7JXq\nXXF8I3Z6vv86Ozo/wxTz0iA5itqu4hrTBui9dU/R4I3fc5xNuuEsfDPTj+cb\nd7Q/1pBoRii/u+7oRK+SYccfRm2qRqxNtGbsAvw1qMT1g4JohVF9HDP5W/41\npaJnozrnMaiIgildkzu4kP2Hsi8Ivg+dJZS07mtEfaqFYPNj9x1MzurB9Mkm\nPq64/UxpSHrNI+WOPwsUv30ysnhEAEO7apTqwNNgRAzaT8p4iEPAznojzN/g\na0vk\r\n=29hx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBnlPYufb9VkOMtk46NBNelzJ/Ru94lns7abbWxExnUeAiEA20G/fjcYY/Fq/nv0XURwB0//K/UIcYwYvJJdWN2maEA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.88_1573469115624_0.521623457267915"},"_hasShrinkwrap":false},"0.10.10-alpha.89":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.89","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.89+10f2395"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"10f2395b3dd00339d85137d4defe0be9b5ca0b9b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.89","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bARlijILUTLT0A5ak5N29pJNJmeMCXVPVPgYFiAz0lSYsw/Z9GIGhSZUCyCMitgZN5tjHQfE1Mtgl89en7XWbg==","shasum":"174035eac0fc69932484652269c9d2995f533e5b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.89.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyTzUCRA9TVsSAnZWagAAJkkQAJYJUpR0o/FCq36D06jv\npZ5paHPlxpkwAgDoHdFMCwV1oywHMqWGR82dtq5k7SsYR8DIdo+cQbiUpi6N\n3x5it10QeOPLG8o8gZJA9gWcYK/0GklIJ6JtwUMJerVfD/uq4D8KX23EPd0y\n5HijH4lSRUsfpCJ/V4EcU4uLZvXD/mDvaPF5BvAik059KZIxzMWMnZtR4nej\nA95KerUS0fG2fJlS9UWj6I29gweoTniyrHNSzOMY+MAtnZaKMN2YsWWeYQv0\nZzuGvJHwE7nK/zJQnU8QU7o5L1CQ8YgDkuKNTLDmeqptFtE5Nn/SJ94eJcSm\nFaHKlG/OO9ZOxaEdVd/aiwtb2j19OM2XM5qsbo/xAr/OqqFiOTM46tksS8fC\nu4hRegpAQCmq1jarXMWXb1WRaU7M6Eb6rPNuB3KS3kkBatMK2rHBIRN/BDLW\nmKspiAdlDoIXiZhkIQwrGEc0roaTP6iC2DEMKc4Bazmu8qJay6vHRZ640G08\n/NYVwJoqh98VePPFCIJ3+KlrLsdjDin/KxrwJZdK3TVDh0As0NoFXYU31/8f\nQ3QZAy+5gBOVmz9GMrJ1/AkfSnWsVtE/hEtl8l9+lFCraleqSNVWf0/yTbG7\npss/LXetzpP8yM4nIBPKs2yr9rwOPLBNl7bLDoDLaEyjfTLJODpfag2N56ts\nLQbe\r\n=1ZJP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDGL6TJVYIcIIUjPVvJB6Jww9AO7Wmy72HZ0weR4m4HYAIgW6hFXyTeJvT/6OgxfE1Fh+Ie6KbvOPKazU0x4x/rXJg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.89_1573469393051_0.11359640977717378"},"_hasShrinkwrap":false},"0.10.10-alpha.90":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.90","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.90+5c85309"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5c8530960d706908831a6f90c8e6b9c9e6921fff","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.90","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-wMyG7ttCHMGGUK/1DOglP0XfKEq0nF4EJdCltap6gkkJXTvb6UB/N73dWVIduxbS0e6CrccqESxzYECoHAXSmA==","shasum":"4e52f85a04d9395faa3445d10ebd33fe981b69e0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.90.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyT16CRA9TVsSAnZWagAA/cUP/3ik+dS7bAMbEytvva4I\nkxG1dFeGdAPhNoOTKKZSjylvhy/Jf1enY773IDIL7K7m0KfL+ukmO0TJ6Y4Q\n0Ej8s7F+3bj7ZcucUAmttZhVmd9H7wrR/4h1vud62ETPBBNn7pMRoeF/8/0t\nhSYzgf5ZpJdXP2T6XWvtbNsg9BKNLU5StV/CjOtvu2NFk8Pql7su9tU8bWuY\nwOIe07/OIqQts4+sstKjkQ/d7ffvALP02DC7s+qnBO/JItBp0cw0dQzfDfY0\n1gLD3WUnl2D8TeVFW1PwMxtjGrPh+89eeaOoS8fCh2CMzpY7WSrxr1tlBNmc\nZft0Fos8mw3wHO4msPCs1XLXlToZW9IaFhlzUM1EPUpAcypLpXjuBfvmh2a5\ntGuib38jB9iLXfBCkfuwhAV6PynjxAo9SDGGJIe35AtihV40XJbu7RrqeCKU\ncL1CACz3pgP345YX3Qt720w4Pd38hu9FBOWRCG6M8P6b0mQSssPWdoPbnaly\n5GXiy3vFLOMQTQ+cVDKAFxD0rmaTySWK1+9IRSX25w+Ee9I/CNwURTty7a+a\nxrs1u3F7QwHSdhLs5rKng8adFxykx9zx3K7hdhE6LlwPmf4Sd/o5NfX+er+5\n+Vrv1F6yaOchsIN3oTSruR/B0HOcOTZkgZaiZVMf1yMfDBLhWlAw6i34hEVj\nwQR+\r\n=adHC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDDSgtWEfNkBXRWJGax4bBgDRJ91bjhcOMgHREAVQgb1gIhALX3ZkZt1U6DjZG3a17mDwO43w99MIvCXRfrjI+N0rhZ"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.90_1573469559648_0.6059412404172713"},"_hasShrinkwrap":false},"0.10.10-alpha.91":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.91","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.91+12cf89f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"12cf89f783d94b05f4cd44b6c681299bead55478","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.91","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-6YUDBxY9wjkcl/x415H2ZR96lShGp5xEL2Tnq0XbTCVTqymRetfQmBetmEQwmtfZ8w12yOhj7z2LD9Sw4ZXxUg==","shasum":"df001956ca43cf5bee2d2b5a410019ee8a7f6eb9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.91.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyT32CRA9TVsSAnZWagAAn7MP/iU/c19/jS/4A37p3Eps\nSgPADnCbuzcRCbrQNofmV+BlIXD5hF/jxxTbHFnf19UlClDgrHd7/JDCDjWd\nA4Qal0GcTr2bLp7wExN0xYP6kNqmFLLb9+pGvDW5W4X6CTb/rWdGVlQpdwbm\ntPpvE7cGXrr7L2ovWQsRISKT9HT25Ah0y8G1J7ttBwCcFnIjLtFAkNPwRilk\n1T+NUR5chvQi/341M47PtdqRB4gGPP6bdVDLjdnUZbyRT/Lnn0OJ+B6D6f8L\nq+SO0GwMHL5BvldzKHcuv30SAj/x03se8XoLF9NmVFgzcEwHBAQfPo5sMjeL\nDeib3dB65D2ShRK+VwXu3RipPAElFKQGzHOjxvVCXuBGCyAHoaAzu7yKS6AP\n26kqEt8Aq0KbbpGCqXPEe2hTbuHV8OYEPxTDTLpiQ79DgMQROWqSXla2KbwW\n55L84oAYaj2fv/3jN+GXqCPY26PQ/1jpM2HdRUDTq478MSfOiAUu3VrgmDtZ\nf6f54KudkSYQ6kpCrPg6RefmET2zI6cp95AJtjDKZ65TtXx14d+tg24jMm7P\nettq8SfbYtqRRZ1SsnKLXNKY+yiCiTKjHS7helSFkZEqe6TdjCfDKLMLPjL1\n3PMzgS3xnBS2n4sB52YugVL5HCHkZ6lynneJN0Ea+4Nteo8exKmOEK1A8i3i\n5JSp\r\n=0han\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCnYfO1xDH4kvunpOQHRzIRBf4gMP2PzRKq2ztf/Z6wgQIhAOaeWeCpPAhfLMqpMDHUJvBQFR8ufHXt1Ab2BAY2ejoF"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.91_1573469683578_0.20985734743946804"},"_hasShrinkwrap":false},"0.10.10-alpha.92":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.92","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.92+934a675"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"934a675fa197379fee8058b9fd1d7a1c89b1d976","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.92","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-NQE3BWak8R4zKju2MHZcd39uIjXoqucpEc+9fPpjqL2a3e9r/wMa7tj1QzuSFeXMLJHgh6jjh8WLwm1VDrLedA==","shasum":"aaa83a86c1421db2b5e9f8a51dc431ed7de0c040","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.92.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyT6uCRA9TVsSAnZWagAAbaAP/Amr3ioyZfaOM2w6lFl5\n+/obbF2aZy+MdOlgAmteOXoGIY6NBPsiia8frKaY5M9qKTQRImXbnEUVcWnQ\nfGVpPZB1yjN2RY6K+tHj+S0VzqCZo5+NV54ioPfTnwxvuprGOghFopnFqxcf\ntEXZ7Bo2E1ChePA5gvXi5FpLjScflk/gAzgDJrqHyxDd3zhieCpfJ73kOkFN\nGMWbt2xkrKxNN/SBUU9MPiKT+F/JwAKLp4kYiibnWr2d+qAE+DCdoadDxbHt\nHLiYgIIFtNKvPueJzavssI2bt24mCC4YmtuTRcWl5EDPFlcfA8rFI+Aj6OF9\nD7PhCAIWttC9tr/yFM/aF99kEeo650wHVUF4cz2KFfsO2Zg/udrHv/NhZoTp\nZAhFCrONCu1MbVl1/0i9lL9Kfcg3BeU+cC04SiQlXNGt9tuM7Dpls5SMuJbH\nIsTgD9ll1dQobyESr2VQiRXMi1IdfZE95VE5H43VCgMOsH4/w3QpwBm4h61c\nCZ10tVsFYlsZhV1WZOZdzZ6boWjGTtzIdeHYNNLZ20sdga6FiXV2+UqkoYRC\nBBnDzfEVhNq/dYpofUv9WvJJmeeZuNkyiz43lIivANuVpqgsqoaTVYXDpu14\nHevwBsK44tU+O3eGYd/qr93GGYqhO9terSYrF7hZcL5o75PAjZlKc6PHfDzB\n+8E6\r\n=k1No\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDeAraJzh/zUvADbmYrGgwmqtnmrx7ESEMHaDxRqW1BKwIhAP25ebT9l8LMDSS0Sx8VP4eMl+rU0eTlKh1rDewmZj4b"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.92_1573469866848_0.05535368221801784"},"_hasShrinkwrap":false},"0.10.10-alpha.93":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.93","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.93+ecd7979"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ecd797931804eb4ea4808ed9c61df444744f323e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.93","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-x2gMLl81L20uguGKrajY3HV5v7HL8HNOclduOxXG7J3Ns1CmQy06Q3O1oK/hdKMDtaDxo4oInmL5p3HHucEPUA==","shasum":"936688897f697cac954b65b2985b45f79d7007d2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.93.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyT8TCRA9TVsSAnZWagAAaacP/0vqDH/OWX+aKVIDtHgC\nxpf4xpcgQvulO7UZuPOY/IpQaO/LqZmxDV1Xo5iWZlAlBmHtGaw6fs1wH9Zb\ng4kzVe5qwZTb6ueTtxwl17ivo3reD1vwPSgG3GgD4jvPGdIxkt8FvbGeojWm\nBSWdj1OIJpWl7dKysJXWNv4gvuvlr/4wRT4RWqiRy1XBhe0hCmS8VevDI/wh\nIRQeDKas2sv4ibnCQdVQEdLntSpkI5r8/N8kijqWxgH6ETZK9rlFxFAtKdYS\ngLxR60fe5l3badxoew93PRdpOJU7kSIioua4YakDJNGoVCBHieS+wZFmNbdS\nv8bchZ+AkZ/oe3ZrNiyzHlPv0o9Qykegio5x9LwCMZEJJ0xtOsKqjW7pzV4G\nUGt5G+3zZiVE7y2s8CbuwundbqgBRHHTx6vEZ/0iVR7jxI95qfDWeqR6XYm6\n5AlwAhgoefWkSDbty94TUlV4EJAOjCrWhBkqnOvDHkbXB9WXPFbxnMcBgh8I\ntTzQc8TKIi63HSepAmQEgOnu1d60AIxe4Ze/K39m6ARZC3dvnSGNfDjAYs6P\n6YuwzFGmH/Lq780j4xfqXdJLuPU/9WJpfH1sn9YW4/rMIxw6HlCv/yAGsV3E\nxaUuxHhnCnGqq4K0U+s1euV8u57NopMxOMkIFMUO+XN0CpFiZlnT9UQgq8OF\nKHgr\r\n=VOka\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDtxkt76AzMEhcs09t1maX1B24wfjlAx0aZEx7vdFmy+QIgehNqXxfi4C3LBi7dOz2x0+dDBfJv9hm2h6nUn3ciDhs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.93_1573469967914_0.8614938503228118"},"_hasShrinkwrap":false},"0.10.10-alpha.94":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.94","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.94+5a2f5af"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5a2f5af8438cff2d749362e77fce055116b30423","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.94","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-b48Aks42ii+FpGDMpfWcnMOW4ZaLCTTcLylrKXenTyVjGVF1o41mGF2Bm6xU18MZOmud8sDztj+5cOs3SgUfyA==","shasum":"c41f73ae6025fc3bf79caec8ed53199df7093457","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.94.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyT//CRA9TVsSAnZWagAA7acQAJpyUbZ3hjbSasnMbKhZ\nR2py0u2kHg+eHbM/1fZ8OmW/qkCaivvOII4eMedWG1k2nDQ4XX6qtVPW05Am\nnzCWSUDhjK8E2oWxC7AMfpmPE/CKPAcyLFmtOgm1+580IsjJpty1tOSxvpvk\n/oWXcrGQDJ9Sz0NdpP5svkL+4cif44Z14xQQ+xhJELSA44MoAR2/nUWpl6yO\n2BdK2DsFKpDOPi0CeBDMt0van8FVOWW0pt/pLXYJHV9aiGg0k1hVTKI9+wrf\n3OQgdROoG2LhFOktqnhAHsz/Jp5QGFo76EEa6BM2gw9CUW5t7PLq7kfoNRjy\n4ivsPqIkbAMMfvRvgvgWtxiRHGiv0BNKqdtV5ehhhCplRQL4/URilYaEk60H\nfxGU2j2ZlP5xxCduaWDwDlkp7PGDfZhRI5ACQ1k78gYFT7ugD0EbbAGPNiAi\nBNxhwOHG2zzmXX9wJScDfwfWw7Ma/FCtLx5ooj4vvSRycWPsSNLwNC02qFRr\nVMl24dbXyOsdRWJvZdq1hTjw5QwvNf+C8ljCepo8DsRlXhO8Ou6mzOqIxKxF\ndM5Sbc3jQFmfM9GXq5qOpF3d0M3a2lSM3ql7Gj983EFM4pkh06n4wT+Fcn1Y\ncJlHX26+Zzm7Pdgew7VsOVblqv2nnQeRAhDs3BbrKb9ECf5B7och6e8vGHt9\nZngz\r\n=pj6G\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIC2XETp3to5k6zBVtLQxSUzKSOdPoON/nKvi2pMrMXLCAiEApbMfwWWj7a4tAW/03NiAZo4r5j10d2leWrjyIiF6WJY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.94_1573470204216_0.0051799244261994115"},"_hasShrinkwrap":false},"0.10.10-alpha.95":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.95","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.95+2832021"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"283202103de97ed78cb8d959802c30ccd4615353","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.95","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-t9PEEjAuDoMqGaKhDTp9o9zOqlYWx8iE9TJ5U8OKDf4DmStePD8n1jAfsOM6x8IRUzfzxnRVCcSrCXQtyvYGGQ==","shasum":"c22a4c440516d77d2c66504262db8a64a4602a57","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.95.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUEMCRA9TVsSAnZWagAAZ2MP/A4gtAPsGxhW4mEV82/U\nvwirLFyyej9goHVMEBpX3EmHF6zV5fkcKbITYF2zwBjtsMqjD3nIZ42BheT+\nZremlNTqZ4bL96/MLUjFKTL7C6tP7yzM5qQGQ9oUAksCjQmriW7zUoUYvVZU\npsPw9/COy0oOAMF1FGrbJtYhSzba2ja3brZgCaGBrp66WSrF7hqj1LzGqy3F\nSMT6Y5vuMVYWwNtmcblEnzu8AySGd80ZlPR/QxpRudceQngtMfAkGD91S6l4\nS6sNmQnl3heAnKNS5LwqoUzxZ2TjY2F/FkzqN/edb4oNyi8xrkocHKTfEcFc\nODFp2xZk2yn+mhs6g8yX40vSnrufNtMyXsVG5Ix677Oy2UbzngaAsglVLvdB\n+6GHFnwNYUwXe5K7P+RuHhgBUk9VaTybZ3EaQaCkeKHaLQtbHTysbuHcxN+p\nFGwGcnDBCkL1/nzUsiAjiNWUqoeDsouVtKpZebP1QxY7S7WbyyQAG6COz/Gv\nu43/VM9H6uvjbnMHNYi2gIaYsOs/DAzbkuDzwXmIkhISnOMWa7eZqBA1qYEw\nijqTzy9ojsWhcTlofAHsw8a3u2H/elRjcGATKnN9nHIdynt1zgP91QeBHBz5\nSAfEdNabmb/yU5XCRgTOh6kyqqZfoV4SeTlS6HxwXgm1Q+ycRLyXuBl8sQcJ\ngO3Y\r\n=pudo\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC4+PB0rWQOeCCafaf/gCslV7oN1EIlVP9r3BWXy2yAvAIhAJbvUi+Nn8IyOAqQJFRoDSroi6UetCaYYD1k/wo5Lbvl"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.95_1573470473674_0.44286852457045445"},"_hasShrinkwrap":false},"0.10.10-alpha.96":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.96","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.96+7b8c195"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7b8c1952360df638e4a9a425d3adad24f324b91f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.96","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JxXG2NIiYXnDfMDcvUYKFGX4YVcWyQCEGhI9nfP0k1iNOBJuiQT4LRAEezhFrr8E+LFFX9jvdMsONJ/AzkbdvQ==","shasum":"070317306e375face70775fdcc2fba465974b6f6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.96.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUL7CRA9TVsSAnZWagAA1E0P/ieTjLu+aNPmhXEMEE96\nTGkQ74zWxytjr6LbYWjTFU1aWPeepDKothdcRhtFBSb/AQ0TGaKSfyl7YoXs\n6raqmDnog4t+KepDV/12v4Un7fINl8idesoTzf6evaZFmRb4R5EBwEqX0siO\njzeXsYZ45GMQhlwlzydpo9WyZIwLsOH9EwqrAlpFraO9/I/cjUo/eGbgnlih\nBa3JUs3tROcp7V1cLRVeDT4H53eUslcdXjehVEqY86hEIxOMdD6JSqrKoBLH\n2Gov6VVnWa8AumyXLZoakeSq/hHdN/4j91D0XiL3puwbc3x/6+/AsNM+Ai3G\nOlpe7SjtkLo9W66Uxeo45UiIqK18NT/3b61VZXmE5NUkFgutPLw3lnJxmjA5\nc4ffuiOwk49MEArB6aQ5TqLVkXMgFkeoEa8QNTt5VNCNRdUi+B50m9A0PAG3\nQ1AxotyErfEeBRsV+Gm57uaUbjHGI0fZtZjHaS2IazazKjIdLT+YbW5AXs3V\n+/L6HXdLxhZ6iVHrLC6g05ePGuw8l/66UjnIK9AFXdKAbtQM9hW1nBaDIaTS\n8lIJCrJ7bvPR+JjuZ4JdkQi1XcW7XvGsU7gZimo+DdsSQ1lO0gbfOthM1MLN\nZGVBtvU/4UUFP4cu6fCzhL7hAQvQGFvT1zvg4X85VxBm8gDFSzOBkHCjJlqt\nGGxy\r\n=FjZ8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDBSjPbfhI3RjSvC95aBOOEdo9UN9nS6cg3j//xLEzhCQIhAJaanTmTOBjdCclC6Vr+W/txH3IS5PxEEkucQNtjNrqT"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.96_1573470971004_0.08689729474536345"},"_hasShrinkwrap":false},"0.10.10-alpha.97":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.97","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.97+a2c4b9d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a2c4b9df8c9b50f30c578e216ca46f6be3a98c54","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.97","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-gmMLutgRg54UkHkMBofnOuny5tlzY4Lr9KKJAOvylhkMheltWOJR6Nvm3Q+rc7bRhs+1vh3S1K4fVbR+puAmjw==","shasum":"0c9ef3d28c930f77ad1533bf416dd10d4f786494","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.97.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUaeCRA9TVsSAnZWagAAXL8P/iH4xr7D5JRCefN+jUNt\nAXruTlY+zRJsyRBiAjQRq/Ih6k3Nn4NQEK0fT0RohLaBU8PRWGhiZ7uV0Lo6\n094WhN/DOfc/2OFYneHYBOOU4RjOr/nzruiHxHgsRmNrQ6XeB84SmUnexze6\nsa3UlvaahRckAHBS2y8o1MheV6Am2hIqo+K27dw2pVHCSyWm/PAgo7kqjRq1\n6/ltKY7DUF7ehf2fYrjbQ87oHUyBpfOapw5cmLedv6yj4n0Da7k8IQTarbzs\nhPoFlUvNXX+Nw4LQmbi5hk4QVDLeDjAmiU7qK/Prc7DMgjRCKDNuktTzVpet\ny64vi/OXwfG0YCrgF2UNAQSWP/7DpMmVNM1MnAL3vyJ8BvIW4+DBFhUUbPHm\nIAbuurk1SINiduH3D6e4dEqtOX4NMsv+5PuAEjhz0aUtSLSuOzfzXv+y6+PE\nl4/SrHWfF0scJ3P4e1t3sFS3EJfmgNygHajI9G/tqcMMPg9uE3KvkqbqXh5X\neMqnghgR1UWB6xsHRnMln00a+IvqlKg7iv5qKGAnFKAQBj1LgUNvyum/Yq7B\nuAJQiB9wPOEoI5YLZhw4OmnQ5M7d46tYoA+qu9Nx7QyJhcxbXCWPk7a9FeC6\ng1SBSu/8OOgZR2RxK3wGVCnWOv2kIqq6BXkiIC4+JwAD6E9rjde4fQcHDb5w\ndoQj\r\n=53fp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDqJNmt4+h9q26vIahqxZHd40WPpvZxPcn6uvM8dkAuRwIhAOXKIbJ78DFsN3BUGUUwzLLCxHwldzPGS0TqqwIWfJio"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.97_1573471901289_0.1411967643013028"},"_hasShrinkwrap":false},"0.10.10-alpha.98":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.98","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.98+6985a15"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6985a1511ed3e2e9294b7c93af8fbd8b82f633e2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.98","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-nkZZkKyo9xm356lO+MYt0uGRfnm2znMkkz6SjGiPkw3D1/BvvPvYivK8xa+2DYXwGcxunQjvUksVmHV+bTOScg==","shasum":"1d1dbe8f8ef652879733d8863bc23a94ba5fc0ec","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.98.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUe3CRA9TVsSAnZWagAA6h0P+wdofU/fQb5dSgYTVm6Y\nIcUvBYthuh7nFkFG0771i0uopVN+vXCXjO9BM8x6UqZlkd91I6qg0okBdh8L\nq2f/j404ibjhPF4knKUwyZkIC8743QnYsboOs1jSAGNBmJW3Jev5QZnmU3pp\nIcVVSP/Qnh/z1MQ9DZODXXKNr42TfG+0X4tOaR4gUSCvmzRNw7DriROYhiDR\nvS4ECmrqJ8QryHuVawHfzOphZMjuu7G14gFiDhUzBms2VhwVadKDPFHbMmMT\nCnnsVSVfZ5chcWXnr400zIU5hbvqnhcJZjI5m54iZ5bWcYUVDTKLBXeQWFPr\nRFHOsgYl74Aa3yjn1bl4djB9in4VpjkVMO6WSJuz2xTC9g7r2Cub+Ixh9TRu\n53GSCzfXBzcnlog4x8MRa57w6BxbAu6t3zhVASD7/EL1BnHwE48Z82nR0zjW\nNOGehHemxJxWfdjqG4U9N68p3fvzmeExv8pFkYJtr/14UgHqzqxqsMccfyFS\nhqTjNsIDsG7Dtia8rVun+1BWwogDCxZjF9tJfpoM3LGuaPn0qHThLQQwonb3\nlcKdZcpd7iISjd3vChv4z3h8kKCV7pvqiPNR9qqtpFRdShbCBf/75A/f5UEZ\nK9ECIqH40gSu1m++d/JyYWF8HzInVfswqGTiBRsR7nomxOaee9veDnRTDOB/\nEbwa\r\n=0xX5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBM4AXrg+VtNe61TG4k4s7eAv36orSkcxgwGdQAKVJTCAiA8B7W5LPT3KUDnqWpyUhqpk+jOgjdGuU7taqjW9JAKPA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.98_1573472182805_0.47815711620688406"},"_hasShrinkwrap":false},"0.10.10-alpha.99":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.99","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.99+99bf0ad"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"99bf0adacc0d09b6a9ba01a33a4f632b657edcf0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.99","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4/hXGJbOcO4Mmtr7x1QERguR8hTRucN8fY5ADllKP3okr4WbIkQ7ORLVsvF1rmm7AnPjJa+kPrGVpzMnmVFVUQ==","shasum":"fbeabbfbd6ddfcae6a7fdea42d9c8d734e8fd447","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.99.tgz","fileCount":8,"unpackedSize":13795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUjaCRA9TVsSAnZWagAAJDoP/iFRFYtqqLjDU8FC4Aao\nckPIHVAuZP9gWgfL5wIZKQA2XinIOuF+kZtmYDQKiI4HcFczLpIk7M8ROPlB\nDsoZIxpZantgaHDj7DpB+6lMKuvwBvcPEXhD34YVqvwkLYlzoluDZ+X1QWms\njA1PVFJZetMtG7FLL2bCcm3KK85q9VlZMjTi9oFDIc9psvRckzM1OqR+dbis\nPWhOBLw4nsJLtHVRlQfgPbfMJ4AccGw3uHSEdv3b7QZ2RyXvbHQyaoGXL1Q1\n5Lgth3bc5jatd70mTSQEBs0i0dg5g9biclLF380bGahOO3FizXXuKY6X0+H+\np/6p+oopCzSkVTTyN9SgbIcndM6ooCf3yuuEcmsznc0RTCZwfy52R2Y+uI3m\nnqUVM7GVRNI6fAhZsjAEDChhPkuVTNWayt1XXeLSMea+aWnmKisuWnO8X4uS\njGxvwES1CjHkm9QwfFc6+XHusoeR+W7SzS2sSMat60/tFuU0CTnGRD4Ba5N0\ncuMxlOs1aqLusTXP04/+TyDxJjt3GHi2ioFPbt3SP/L1xPTT9DgnKhaVaveb\nJUlFWMT53bI/cKCwn7LRl64gdUi5GQuauYdbWsfHhz+rRM+h5hO/F5ZrWaKF\n4Fj49kWjnOy7YPkM4IBt93RXYYFgAxeFFiuegIlOeyUmQgLt28JxbbqAf/Rp\nJQHK\r\n=huA8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHLCDPGJzRxP59giXwMs13QdR61lx3/w6NT16X1FnkF1AiEA/1F7iLojL/NNWoXEpYut18a6MF4AR2SzV2KbTzseyFw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.99_1573472473690_0.48074322382478085"},"_hasShrinkwrap":false},"0.10.10-alpha.100":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.100","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.100+1103693"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"110369347353a39305d1d065b02cca9ecedfcb9a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.100","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JBWdV9r+sPWU90P5S5KnfyYlo0a4xakmhwJ8s3OqJdxo5GySHlEzfkwd0OA4SszfWcqRKxjUVTCOr8IOK5i2HA==","shasum":"2d52e7c54f471c5e9765dfd6c3572132746ffd9a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.100.tgz","fileCount":8,"unpackedSize":13797,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUmICRA9TVsSAnZWagAAH9sP/2PdlaNc8sWm68iIhxPg\nN+Ne5LWkvYs5sBPk3LkroiGiAQAQWtWaob0s352JUFo8aFGW1wKtwOj9368d\nb0m9WicK4mDYPxGD9rzROa5veUET7OLZDqs62EO4NSjjN6zsBEr7aPVz2Zaa\n9VYYxpf5YrbrY3eNHGshvCAcMOVGd+8oL71KSfCqIAUmMGJjW7xs0QZwkJ09\n4Kyg4tk2QDNrtfdJSxSeyoLrF3bUAkNV9Beb2Yax0P7dTLEYnxmRS4OWqCyv\nnwE1VgUAY10x3Lehlc4kixeJ1dG8jp+2zdR+HFsDPKyfcK+2dJH8zZdiVBc4\nqTCRezikxPZ5Xarf5AEfog5tDNqWYEW3NWhmU24uOokUEtNFB8PoSRgdZJ3S\no+dk66Cy6or/ZRmtnr1W4Ja+J/1yeJumwndu62bz9qUnGGBnCQ92kbw+OE7p\nm1jDDPcMwOtafspnS8b58G/zaVboFnv0cNEkMvonAvBpHgr/2JiZqAXbbthl\nwceAWZ7bpUe7b5fV+9l9v6Js15MZrdYF7HgwzD58HC3IBt0URpIb4ktwaSC/\nW3EXLCiVH0qAoH2+x9pU24hzAHeVhOaPLYVFhHJvEMH2u+8HD0AsHbnbRXJI\nTBsKcG89nQcyZP+xq1O+yySP3rIeoNijpX1TzQXf9eIp95i2GAZEt+nIwnKM\nrCwA\r\n=Y9Vx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHt7qL+sLi2DWfV7lTdHnV6SanqhfzfyTQhZtbIRUrmvAiAt8SKB5B4YLlMpX9lFbPHHi94rherRnJQR/evjrOb/Sg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.100_1573472648060_0.011468386867125924"},"_hasShrinkwrap":false},"0.10.10-alpha.101":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.101","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.101+1cf83db"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1cf83db9fed0dc55cec31ba6a8f18232549ed0c8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.101","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-NOmBiSfXDP0kUHP3dBZN4i6EKqf0mJJdBAyRFyX9peZ3Zi8TFM5Pk2TEwwAdb68aSpmcldKaoKBMLpWCwab1rQ==","shasum":"093367df85c621a45a53b2d34bc9218c75ff3e63","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.101.tgz","fileCount":8,"unpackedSize":13797,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUqPCRA9TVsSAnZWagAA2wMP/06v3/Gb0Uanv/TNstbO\nlgQHiU5F+NE+U75WFteqNsrUCeYGNkBYn/fjip7qXsK4QVU47spNg0DhtefX\nrU8pBwMpqKC8hQ75ulgJOAZvQ5tUKpYlHZibruwdfG4e8WwQmis316YMC+qn\nnYLw/PpRs1OVAvh7hdvRATBx5/NF9TLbnyocdHsskQPQ9oCpUkIwziuzW99B\nMtrP2CnHPW2mV52Ovz5GLjSpA0Ocwb5KZZxiJVrdkK6b/t240zMjsVQ8WYqN\na+h8VW0nYkZ2iOOOdA7uywiVJiUUiPlBIXfskRmNH+C/2/Fmw8QDqL1G1bxk\naI1cCQA35/rAa3Gwcu4FWQbqkIX8bdjfJHkyim65QcvDyxNz5Y8fD33T0S4M\ng97Pe2jkNt8zIb3VTSuC6yj67rbn26PORlVynkVru+4jo1lXz44hN9dhdU0w\n7sTNEV1WRakPKm0BjYq8WFzaFDTwz6f06he1lYRtC7mzeO8+3lM4RUqVaVpS\nVoz4JVSpJNT3VIJADKDwo8SqDuWRMXpH01YYLcNGr+TBESaH7GvaCS7kaLvn\nI4AdvOyLEBKPUpo+9O2/hMndHGUQn8bk3lsuTUxPy4OsZ+QtVPkeMeRZ/ak+\nY9nUmaUZM2E9MdyuTsMZ5HbZgfmkApt4R+qeiafnRiO+9+p61pzqUroLnUYv\n5OSU\r\n=rm4m\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEXUO4dGrgJB7hazhWPSS7geOctE2CfXPoNoTTy2zIFtAiA/pFO71LizON8D0iCvVrjSOmMd9eBicPxPC6nUl/qPTg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.101_1573472910840_0.6542817639458554"},"_hasShrinkwrap":false},"0.10.10-alpha.102":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.102","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.102+6199dd7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6199dd7459cb6b5e3adaebde8517db192b4965cc","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.102","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ZPh/Pylwu3BtMHqMfl3xK7UriReuAny+k3i5aC6yg4cWwrSEYebCL32JqOS5mTpu0PMPGpfzeAhrAzKMMF7v1w==","shasum":"470124f0f8610a278c9e5c188ed4612fa9653ec0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.102.tgz","fileCount":8,"unpackedSize":13797,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUr4CRA9TVsSAnZWagAAMIoQAIozWjPUqa1M/5w6Jcc7\nRrJH1u9zR8C48fZYQ5dWzZSQFrBgpx4yXCKWlklalFLHs7AX0AaS49LTKz0M\nf+wyE7Pi+AZZeivir4XQqqC9ctplkhwUTlH4/2cw+zMKuCzY/KS1PgUmitUV\nlqH5Okzbsvy6pxhxf8anErMlXhem1bijx8lhxI29DYZcR7tTy2A2BYGuN9aR\nPmmK+ii5vgknDqQk3wMdHT/owdPHDVya070HHrrviSsPAPu3oUlTR6BJe+Qk\n9gZRtdjuD+PGy4X4iAfNmYklVzCaUHtKRaXKca5HOXzdIMHsJlLY5fQ5prsK\nTiGxMlqHw2zT5lLAfDJG+qUj9mC2bCKHiWIiDSqgiMIQkO8wlcluFLMUtO1a\nYnuPx5RxMHm74m6wV9wqNBN08wSXr9RYzVEVP/awRNPzDVQsO+HpZcWETxPB\n9rNnwH3CMqoEXC5S4FVW+9EjQBbpa8qmaZqai7dE7G0/7w+HIu5eAoGpW35m\nLkiArAI4/dUIiB0pLCTiDGCdmPMbRo+eD00UF4kdU2cC/TKY6VdIQ7e8BT4c\nST0psNw/hG6RYM/EHgADnzytZHk/brqjnZQ9GTC1GDN9bYn2DIlUF3aW/Ify\n8IVfSrwFPN7yZLWfGwjMqS4pSVcoMp+gL6NIxJOWl2svuFKH50zo4romQ5be\nHBsr\r\n=0Lq7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDfJZ7pEONJw2NmQPZfF2aRluCfCkrPUkCViHU4bpK24wIhANQSq6VgIHY3+wr0C/tRxBj/2I8xrECJCPFIDpu7uExU"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.102_1573473015860_0.4441134584361368"},"_hasShrinkwrap":false},"0.10.10-alpha.103":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.103","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.103+5a64380"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5a6438048660a83e81d344a576cb9c3a6b69106e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.103","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-n521w5wDQgxQb3Azkomchx8MglnYXWm8CQD2pDMGTtLT8Lr1udNb8Q2uwxBf86fBvsrTNePR+UMOE9j79uDYWA==","shasum":"139a0c291c84a348d9a94ce3f2d32bea8de5cac9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.103.tgz","fileCount":8,"unpackedSize":13797,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUv2CRA9TVsSAnZWagAAtC0P/1iFhM5iv8c32m6/+8MI\nEmWk069V9Xlikc2NgGiugsBkLJsm9wmkgr6v/VCe2N4fM59wGAEeTfS3glrX\n1+e8FscZf22jn8PmN+pCovx0U+HX+K/lyPQL/g5UduVSNrpyTCayIqQ/RS6X\nb0AkHPGyEkw86KyrUENrYRhKfpzBN2fp+Fxt0Rtoo7tk9GRwkXOoKRF5eenZ\nAnXPeZrhuWuzhuD+MSezqU7iLDOMfVi4qsKI9Yqkwbk2UfZ2e5GSvcUvrI8O\nCPiInFBhlhh43R9JoM1fmtqgtOTM7hbw1Yx7ySNSvq9z7a7i1hb/IXUhQ/3r\ndz9lQCGQqK/Qp9VkQvS68UC1yVZyBHf+wpdVaHLS66lumtQTHUDA8VBnEFwM\nZ1affMwU2PfXdNeEDsybzX/R3g9uhInkCgAMH2gz0eMb43MP8tBrF4x5XW+V\nRKFbL+AWGffCi87YkN/mayAyRi8WCF5Zcya9qnmew110NznqkCeef5TjwBMt\n1oxyk2zuq8D36R4kYyF+Tfq2IylB/Nj71zUeKCedB0LD3QVpTb9mbTh6lcnZ\nLQKq4beDDmwK3q9EIyJORV73HXzRcZx4ReKE6bCzswrYveptRmIQPUZOoKbp\nCpcvo/xHJKWu6K8WxArVCUsWGzj8FRQI7Vyg7ZbL6Ke7ysifrGLT3r1oUfvM\npzt5\r\n=NP6m\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA+OG8D5hJW/sUvsvqtG+DRWPi1LRy+ZbZhdYjomilnQAiEAssTQoatBG5iMa0fwW5RSgAYUSNRRDO1/MHj8f56fL9A="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.103_1573473269761_0.33830123093873343"},"_hasShrinkwrap":false},"0.10.10-alpha.104":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.104","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.104+11893b5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"11893b5ffe510fc9513751d19a570d188ba5153a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.104","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-QaX5cEWgaxB+Ga324DjreGwgdLIEGShhKwbzg7WC0NjvGeZI8QhQU0h7KDjNczMmwtC3VSn8ct6261snC6iunA==","shasum":"8492ab0d6a724b122b5afb14ca48d1bd9792c035","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.104.tgz","fileCount":8,"unpackedSize":13797,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyUzRCRA9TVsSAnZWagAAQPUQAIdGYuQZvb8ujb/OT2LW\nEMn3OyQ6JxD+nm6VV0/ScA0aH0zmAU8LloBhlF3ArZCtPS0QdT2tJHIF9tqf\njhBCwPho3w+gUI70BTDD7xAuJ6CwDg71cjxvguxHwm1Fs0JmwHkvgRvaOKTt\n6OAxcjKdujoIdg1j8JPnYZFubZlI247QGw/sPTyeIxySfaZ9TSZdBm0lBM2n\nKyuV5ylgTi1nV/Qf2VJ9BW6qN2cN7UES4aqyVbP1NUs/IDsbamvAKz1hS4/7\nVSc9MYo9PAEwfK6ct7KEATg6Evtwqg0AkZMY0VMW4FVdyqgHtfGnHEW/KhVN\n/XyU9dMN1CI9CQjR7qsz7kade3Copk41a7/gl04Wyz1lhXTCfmfF3x0lEg8x\nB1QB7j87kM12mcU6d67OmPyOmcr55mDsOmuOT4CtcgUm6ghrM+4BEhlEgIsr\n96xpeLw45R5cGYU6ioFkJKjlX+KC9UwtriuW5tUIx/qPR0AyExw8iGEO9QRO\nqHe9ok3SW/hiOB2yujwYsaoYJaNEhBqPg1dpnuQLZ8Z1MoglFQwNU0OHlOPa\nhpPykUdqgmrSoR42Ui+auA3R93DjsMyJ84Qvrw7LndTwIDtMkihPf1WIL9lb\nJiEDQVar6AwLAJgBn2c5dflZCsIQ/y+FjY8h1Qj//Sn+ZeYxUYl8+BVV4e44\ntRUq\r\n=ooyG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAzeBpPbtrKKHrq7MtviGPKIJVjvSy+KKrT4mmBM84qEAiATOxzFBuF+qx2rr9SVJNiOF6UJZPbM+TszVsOCO2p0dg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.104_1573473488688_0.5808883972421244"},"_hasShrinkwrap":false},"0.10.10-alpha.105":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.105","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"dependencies":{"@react-ssr/core":"^0.10.10-alpha.105+97764ca"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"97764caa281838e33cf66dda4721b1d476bc17d4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.105","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-xkGqlkoCmqc0OEcgMrFV7Vub6OpnEOFDLhrDBLiZgnr6/5ECw6scPLDfUb9O5IldGute1HMvKQuHfkCx5/5Pig==","shasum":"1b064909281671364288b41e856029f1c83c9862","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.105.tgz","fileCount":8,"unpackedSize":13918,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyU8ICRA9TVsSAnZWagAAyg8P/0hYuWykSNH154vNrTfC\nrL2YcDIJ3EU4286DmV04w1E5dDKYwokzxfT4v7A9YxB7GXxBmRRWyXyEyd9v\ncc9xtzlXURDMETxWXGgen2aeNdVMFoeICn0MhERwQ/Zk1EYD4ggd6hkm9RGw\ndjeysVKrMG9+xvKFFl+AwDUCt3zI0ZEefzDCaVvqg1CRR9s6AWwan1+D8dGW\n7RpcXC9T8X1+VkLuGSzoilu0++IQh8EPWJaQvOoQ0vgBHPXplswc+BsRljGY\nO6mmB3Qc+l025k0yeqgfRB8jZJVo8nEIPAz6JmmR/jIBFaWeniS3LG2ja36O\nepBDj3c9lXyr7GeD+jreHa6+iVpAQa604FQw+neR66BAF23hTQTPkQMslPpm\n/aj+1mvvPlbl/m+X1lffuNoO5t/1hkpYeEGybwUt2FIP9dnN+sitN2hY4v+2\nPjOjMC7jds5nmMBJnsCtk4BNd8MJp93fXnu0H6XI0lfe5ihROi2MQSsZIPpg\nvIL4Lj6rkkbJ6Ql65WWNvzie3xZ49Vos78/vNZO21CQI/K+i2CsdIFDEeo+f\nCokYdD+/ioUCxiFqDhQfOkhHESapFAC/4Vsi2idY5lRcZbGY84j/hhb55RAp\nNKIE2XxhjPjGrwsqJMLQkXBfzEv66IeEdNq/NImBNC6dtIREr5tWMsVKjwyK\nLuUH\r\n=X4q/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEymsOjrpIZQJR4y3ELB5BX8A1vCfmJLmrdmIeX6lXI5AiEAhgKSJGw46SDVfhsQ3VZm0SwalQEBYDk6UBvaCvaEdwM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.105_1573474056097_0.5119708159210556"},"_hasShrinkwrap":false},"0.10.10-alpha.106":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.106","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.106+e764309"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e764309ef1506af86d52fb80fca046fe95f0572b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.106","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-H1dPWYyHKxy3RpfLJ/k7s7uEvTLBn711j1dIvxElrK1H0XktVxv8fWWRyPj1QHW50MsucW25eGYaVYWRZzACTQ==","shasum":"8728fb05e3f623fab287832c277bbc34d10ec8f8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.106.tgz","fileCount":8,"unpackedSize":13940,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyVBnCRA9TVsSAnZWagAA4KoP/jndV0g/ZQo5NVEZjoiF\ncXQe674Fp7rFr1E04xhLP9wUMsV1rjHN3Gkk/OGCnTJXg049wiAURXuPWcI0\nDGQLZ7iu5uIJjyv0JIh8PwSLjDlj+TmLmiJ71svzq2OqPWNcERom3QD/+qp+\nYHmL17YTduq1BcdrCI5zik6PXmIWkev3Ge6gt4AKfLEzl4+ZQkmPmXeASCZR\nmHycepDzZ8knEGINrS1oWhLOUm07RknndzSjBpi9MnNWzmptxucOM+dB1Pw2\nHXuKfN4SXPmDWfj2B8ad38Ik6pEiIprFI/Wls0t/pCaSP0xZzEXVCTe59L10\n69+8DZcbQlFNepmmpdZ7qD72X69p0EmiMJmjxAeIvv39Lo18aJeUQOtvNPJG\nF7w8zirxkOAfFNHmriv1s6cMAm/VbLO866j/jDbzGvSzLeWfDHylJ18TR++Q\nHLbxTjkCDPwaBYh1p0nNop1gv35mXLyREo5IApMj2kl0swSCFoesv4bAb5Y1\n9gDQPMlyRlxQLsBC4txocBqg423f3NyRDh9ZHGL4brj1PwUodnyh/Itj1dir\nS6j7FnS3hpWl+Nv6Gg7PTXNoMDBwGu6lyL3LfgYKoIQHR5Q+xUC9C5mYZBoZ\nOCCtEu+WP3678e8I1QkICf3dvizv8cYFIXr5pEBI4gXXmzJ+DFOppRetfmMJ\nTuA6\r\n=Bhvu\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB46Y9+J/rVlPYEBuba5Y3B/9raIzmPo4/fpRl1NTh4tAiEAg36nuvW+/LjdR8PuMyqfjFzGsE1ZtqhJ3mYXk0t3MbM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.106_1573474407081_0.6704285432616393"},"_hasShrinkwrap":false},"0.10.10-alpha.107":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.107","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.107+570161b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"570161bf42439c4953eddb6f692b19065a35c41b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.107","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Zt5aGxQgRCz6B6DFjdbQNWPsCAwNwwuoMGw0dAjtrezttaX45c6QMWdcHdOP+2t2bMXeXkNoWhsL8+aF9XYgJw==","shasum":"7cccda983e2e47e43677150575cdb34d9050415a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.107.tgz","fileCount":8,"unpackedSize":13944,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyVGRCRA9TVsSAnZWagAAxUEP/RgK8qVRgAAr572B9w0d\nvQ795KZ5d9IAFS2Q78dx1sqzGViIZL/FXeN811KbqLq6yQScjjYLLCbLnS7B\nzhIVhr5L1ENVBST+DxSzG99a84ES/zz8QCXD4yCK8lSOOPwneMv9Pp6O8jAy\nnou1e7V3T8u4P5DLYZLVQa8vZT+x53kHkwKbfYMxfR+sIDknX2qxq0bp/Uhl\nfGk2qDZARbVzg4dbT8z7Xu0Y5cYnnuKG4sLpWgtnjaX6mlaPiziG10YPQdO6\n6cBZe4BebATjVoq5+iYZ0Kq2SZknxHtBTAcAsyRKOtskTSZS0GZoWnD2JTGc\nb/NWZ2QClnhbig9ISILlNPNwrz9rCYj7xM6+X15OMtxZEgHpf889/ZLnXZEd\nXEXISGtnJyr1Ap5k8HlIz9jDta2hoky6hpkAPS6bRVmKnFK+9XjkTQYmHjZ8\n8YemmuMtsY4lCUq3EDgRk6AnzAqwLTK9fs71z+Kfgw6XeV7lP6oG6DaL+pTw\nYz5jHMTQOZuXKDoBkemjn4Xr0gI7muqgKnD4sD5Ff41shuTNkm2A9Z5UUEAz\n6lsQvBYGD8xj3iwzkDx+fXG+qTxAWzhkVPAen2CGSOa4Jj1GAI7YohOorqjo\n11gVWEdzT7NtSX4ZCNpbBHcjURPSx0cS+KQZoVy/jSr+wm5jXUAYJ9fi/Uqc\n11LW\r\n=IKAG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCnCsXkFYabAZYUQ7TC6G0Aba+FjCD8VxC1fWe+8ygDSwIgBKIaqP38JIyB2LJ6IfunUQI9L9JXfBlnzqtnpt12asc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.107_1573474699274_0.9357048683555231"},"_hasShrinkwrap":false},"0.10.10-alpha.108":{"name":"@react-ssr/nestjs-express","version":"0.10.10-alpha.108","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.10.10-alpha.108+f1f58c6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f1f58c673f674a719db70cf8f911611daa0305ec","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nWe can create the layout component like this:\n\n**./components/layout.tsx**\n\n```tsx\nexport const Layout = (props) => {\n  return (\n    <html>\n      <head>\n        <title>Default App Title</title>\n      </head>\n      <body>\n        {props.children}\n      </body>\n    </html>\n  );\n};\n```\n\nAnd then, just use it as always:\n\n**./views/index.tsx**\n\n```tsx\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <p>Hello Layout!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `@react-ssr/nestjs-express/head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport Head from '@react-ssr/nestjs-express/head';\nimport { Layout } from '../components/layout';\n\nconst Index = (props) => {\n  return (\n    <Layout>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </Layout>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n**Note:**\n\nBecause this is an experimental feature, currently it supports only `<title>` and `<meta name=\"description\">`.\n\nIf you want to use more supports, please [issue up](https://github.com/saltyshiomix/react-ssr/issues).\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.10.10-alpha.108","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-BFkt8Oy6AFFCikGtERjPm/irsD8Eg87soIZ7huN1o09EB/byTqiYzwrHqZ+3PFzLS4f3Ov8a/iHkX8ya8a+49A==","shasum":"f0ad8309cc2ec11ec02566bbd0230e52f348729b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.10.10-alpha.108.tgz","fileCount":8,"unpackedSize":13930,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyVJdCRA9TVsSAnZWagAAVasP/2AeHDHdgSo96bI8N5FI\nxFIM9Lnl66HgfO6EJuETOJrFOT97ECzgnrjNbM8rwUjTlRuSuam1s+tYLyXF\n8uvcyr/LcobXv9aXMEZWcRd9uQroelvhXICdtrJNQwN3kAH9eZeYUiVB7oWi\n5laDCuoJ38mgkWdH34eQbptWxYwsyK+sixNVD2u1cFHhwHJ7h7JdrOuSTiLa\nsnRK7inBlJ+bLpKMRQE3rp6Vd8+RQKnoiW3SnAQx4yxB64oFiu5VmZdtOw14\nFZDQT+3neq4Mxs3NekBbuSMx1AYF/24HGAL0LioCX/DQpAEaSGE6JF78/fjk\n4AigZI3SDR6qOYoahc0tQ/1mI0JfVlYqNfYwpnYMMB+GWOm5sX3ZMi6oepca\n1SkwJczHICL9cpIBsfLwiIYgLG7dINJLUzZktLvUVS/aieut7kd+G9c8XLT1\n+6rj5XkaPyfnK89qST1XunEqPe32YkerjIcZpmmw+C7SBLz3wPcKFzgwURHv\ncTrIcCUMIHy2+P/eHnf23GwOh54BndpvkvzNCacHEGsPpSu9XV6eUJEr/jtB\nYQ3W/EbbRkIi0FVC5GN9fJOQ/37+msBxobOIUQoZa7BhZEDYS5BFVA2qSG+B\nwHqK96dr1x1/wCEQNud8uIN1AMrJ8vK4IZD8G6T0orasjCfTcCLTDgXmxeOo\neVeS\r\n=A3ZS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHtNoCDjYX7++WDGCW5Ya7XhErP4NEVeYYUG360f+54wAiBDLtCNhMce9uV0wAL+C1e3IDQqCJFqsUtzIPcR6GABEA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.10.10-alpha.108_1573474909169_0.23279980078574658"},"_hasShrinkwrap":false},"0.11.0":{"name":"@react-ssr/nestjs-express","version":"0.11.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5a722c0d8891e129d28c35d2d63d81572f0179e3","_id":"@react-ssr/nestjs-express@0.11.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-FyLZJauns11MFK3OmKcOrgqq0nn37ED+YYP3iaOQT3K9qRYrJWu6cYJHGj0AnMRDzsFEdJ7e+0SJ+c1dSGTvKQ==","shasum":"7427a5fd879a9920148b0413583fa51cf3293d49","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.0.tgz","fileCount":8,"unpackedSize":13728,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyV6cCRA9TVsSAnZWagAAXYAQAJd3KWGl3vXy70/kCs/q\nObtWAlf89pQu7Ok7Ltx8lYIIj+s6f4dqvjxrg69qRiEz7aAgyjIuDgRumU6V\nRBgbgIl+OZjtW5UDy/wt9Na9r1+FNox9MqjvTSkNPJK3GHoQAS0GMUWfLu5K\nnDFold0I940fdR9XExE4+XpcUTuAbhI5CDVpNFJiA3zAWSztwpRDu/5M2qev\nvRfjMrmCcQvgBmwZ41sZW4XCZ0cCTGlbw3kLd7qisS32uZL6Ba8haYr/+17D\nv/tijOLUIAH7hT88ltgUFP9aREMevwLsGOflOTNBIHkswreOWEqXY2eshkLl\n8WMwvv7cPeuUA7LQdcBmZR7rXjfa7sOC13p6NA6xgdY+JJTSVQ5jcpdHTGim\nFQYc7x3QgYXK7Ob1jccrtO42smSx3ftMwclbRVAhCcQr5dDBAs+BqdlHXVEc\nS8QFMNghHWhyEyy3BpDnpKoZ7XlOF6ID/eqENH4rLyxbDDTjtDLIlyETKc0/\nyLtAPby6IVI32VNsnaHWOaf0MSpivPw/opg/C/e1xqWxSEjJO4TyIBdIvFWZ\n5Rw2c0CnqOIrV84ae5mP5TyjimY6xrKUwFeiHoKwU2fYe4XP9raRsSu7WZsw\na+Mrmluo8yWFF1TkpQM9GDC3qhYuX5G9KNtdMpeo5fgWeZkbBaQhTNvQIHkq\nc2RF\r\n=nTf+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDlwAnjEF/17et6jFfUkQE9HhfCr990mNYUuFlmQbSgZAiARnXZk+4TqN0Wv6dr7TN7KAVVQTq3YmdfLO7QSePNxdw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.0_1573478044198_0.7712359319660933"},"_hasShrinkwrap":false},"0.11.1-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.1-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.1-alpha.1+59f744b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"59f744b6f349ad6491a3a314ca7ee5c166be2cbd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.1-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-6qb4wL32X5tMNyvU2GtR80MGfPBCv4CsfUywXbOSALseA0/DvZBEIGyqEghO9N5jx3QYZjlpyJmbBdr5zbzaDw==","shasum":"9cdac83b02e4afc47fd04a3b0e167164a8666c76","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.1-alpha.1.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyWHiCRA9TVsSAnZWagAAkccP/3tcftSmDCE/4QM0r7Ko\nPaDmbTUJ/WZAC9B3TeXkXbsmYsaSHCy6iPCoTdN1Za86RqQJ0jtHk3YVTyMi\nSJCkExBot4eVW0n863sf6e3DRpqNNrZQqIeRf4YCNLloH734vL1tUOu4NP3D\nClo/2LkvU7KIZoaFDJOyBLTO4cJ7wQdV6i+80AyAxw6BTxr7CvWMchJ5gxyO\nPdb/yydpZmDa6/q3kvFks/4OF9fBNYOFH0M8W8v6Fn/hzc0nvJoFCl0kwkCF\n/AkCRDRK7t/ilSR/B+b4z6ECjH9lpfiH3kYlpv2tD6nf+kS9vJrblQvEr9OS\nDdiYPUXorlxmxa5rGzsLnBH8mviE0gT/0mTj36ZbnefcoDm45PGqAYrXoB5L\n4kZKrkMw+mN8A5AqS3sylMXsPqrvEKKPzAest+L3BaQXhYSUMIBLNPMG0of/\nDzHM+AE9+i+3+1kul3jwDw3KDJSwf8CO4ismpXgvcNV7rVLJ07STxoSR08hf\nqj8VKdGofRVAGMha02XDMq0PWeLIr+UaMGS+KeWbiPUb2vLPw5Hogm3l/UZn\ngNZcOEQQeUcKHSdt3RXeJMh5C3KPma3oPxika5fGR9UxpYoOPLiB5Tm7Ll1l\ntshACw9ehPPf+vnkuESVLm1rCmhrVG2KuGo6061RilqByUAAmq7kBCTLABi1\nEpWK\r\n=FddF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCrL25pOEP0TiaS9A2I3bmYxQe3sWplcrMp/G0NQjRpRgIgFWSKuSD0yeQLrES+13x/9kXVIYrhrkwUWkozlDXyfZg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.1-alpha.1_1573478881987_0.1253279260299831"},"_hasShrinkwrap":false},"0.11.1-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.1-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.1-alpha.2+f96817b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f96817b965fe920c36eb61097cedbdbd046cb266","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.1-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-YjZqRzQN99iYGis7UAGlCipbi7hJ4ywlrK+EudH0U4rjkO+IyZa8khmiEbcGp8cV6sjFnzmy2atkjM4L5+PZKg==","shasum":"4fd5b6a5935dcbd13f9ed0e24a71e04601f4c74b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.1-alpha.2.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyWSfCRA9TVsSAnZWagAAp9AP/1NS529UFMOM9+I8ejJq\nudmarIFfzWkKiQ9iVarm4qy+IzsJ64tVsP9Nxp8NOyf5QsNf+pp6zwMYZNAZ\nXshph2Qk10QqDOTQjygDJAVvke0nGiWL/+0j+4ApiZo+K8AhoyA/RK524IL3\nohBjq/hPi+4ru3/NWjYHYdXgi/ekAQZ90hoDBPTAykYdqUZwIUJYL7gFWIcu\nrVB7+1kuxmGdlQVsQiyvJ4ELLRBw+/euHPxv6ebvu1cqcKX0wU/jaS1fEws5\nYRp3c1yQsqEUdHfkFQWBh83ArkvhBdGxYdjap9Svr1sHnWIerqwNy3m8Ae5u\nwZDGl6oJNyM9hKY+sD2yr1vhkyvcThwek49JgEh9kaJf9rpIzMQ3Yx25msnI\nCcAD592iXo/L4hN/oA1B9R7A10I6Pl591gT7cctplj3zuGekKNyz4BZm8LDV\nGatRmmvEruZZ31rf19TGmvVPjVGaCE98bojXHxgCHlA0ghYg64bnJ6ieXnov\nO/G7Rhi0smFTUqn2q+ALTgpmaO1Yz08xp2zHrIN0JxkDvIlGlN1b0hdxd0x+\nhcz8VSOObXitz9qhH+x43LrLJKzLnXERTcpmBgz154JB14V8f7nsP5iZ9sX6\nlN/eCDAqwW3VToPK0H0Cn0HHe6kHMi3Z1WLRfsUG7/FWnQtjzEyl0q/JXkuw\nv5K8\r\n=lsvv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGWuoFs/7vXBIVcAt2MuneJ3Z/pNz3U40vhhsrD1240aAiAaAesm0RXSp6fCO4ZPPQ9dnMANJwLvHKpsn0gbir97Dg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.1-alpha.2_1573479583038_0.1750330755242857"},"_hasShrinkwrap":false},"0.11.1-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.11.1-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.1-alpha.3+761c192"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"761c192e3d1f868b83e03e5b5c27e2b381aff420","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.1-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-gMCkWS0jhtfrlsy+VmEf2xGAbDlr5PyW++q8VgqUIOTmqTrfpN9XkXq/uHIt95jPQ9q3frT/2zNnft/pMfVwZg==","shasum":"9bbb9134757e00197420dade12d30446fc88eef2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.1-alpha.3.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyWXiCRA9TVsSAnZWagAAg2kP/0jBezpxc3RtYqOschG4\nUugt/aXcY+OF/p3tmtPGu4Gt/2zr90kd0IeqyWUc6G6ehmE+qCsZssgxndAI\ngYDlJimHQkhCOIOefNqolqm2AtU4D3sHCrwUczlDdvK/bq3xB6ToqN2arIwG\nlo1HxrBWRyzlRDOx2Jv+YWGV5qEuJ9HuppCEA0HxE7aaNCpFejJOV+q8kvYY\npVni4CfSWzkgYqBylCu/2EwEabWC+PVoTQJuzsl91U2ZTlIv4ZabK3OExiDM\nKp1a/p3z79WtGF8MroYZTbrMsjDncxEX8YE3eJp9cFHt3sLuYunfKkr6P/np\n0nfNWhioXXJytk36vvwzH67D/szzy509Pja8zM5I2aRq1yEjT0NvJ28MLcpF\nI7CcneWLtxpyLuvSGHQ4UB7ybB8aJjfy3j2tiCsY+W32IMoD2fK/gv8etkG3\nVKbxTMncMonSj2xhQnWd/4i5rJVcEEde03mgJeYmOpDtCeTF5cDboo4r7I3z\nYV1yzvD6kuev+aElnfLLP7JOQ+0mS3htfgfVOLDCndYn8gXa3lJkTFVi1BIA\nPpJNH4J5bVzClSRUsGFUWlLkjvCYORXbUmbZ8spjFDnnTmm/V1v3QMweO0mM\n8/5IxxjIXKSQ07LKqDowEAGmOAf9cdozAGlFaBybGd9Iw0KvJGcsUVsLPv20\nur/Z\r\n=2/1x\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCliVdGH2YVGD9LfHImP8ChPOyUboX4hSTJoSNOZUVeZgIhAIZUlOclog0JHbdKiw5kr3A8Y4fo2xrmt2zUL6rHLFyO"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.1-alpha.3_1573479906124_0.4061814622872255"},"_hasShrinkwrap":false},"0.11.1-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.11.1-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.1-alpha.4+65cbaf7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"65cbaf78e0824d9913ccb703363df74683480907","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.1-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-NJXSpN8f+2dlk7CvU9IyoEpJTTJx1Eqxvfy3J6lnPQsIOeRpE0DN8c0q305sBuhMtSsRCs6URblPfPWPwZ5GeA==","shasum":"d470fabec3b098d306ee0584bcc78754dbc34ca2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.1-alpha.4.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyWl9CRA9TVsSAnZWagAAn7oQAJ/ix4brqzTOyJXwkySf\n97YavjtrhC4mGxMvgoV5obGpSZdYNSxG89/yUzREgKG2oMVgKa/GDC2LzAlt\nRpz0HqNmfmrE0ESzP+s3HD6/pj9UJ5JRYccoHvFUWnf24o8F5mugt4CPm5EG\nvPhNK+DVXkqtwp9Vj0xXB/ReXLrEYJf4sFUEazgz4GE15bkx1kYfXVl32x2P\nwITdmAaRgEc5x2lwHpwH5VDk61CmBVanfsXSzu6nIsAMJwp391aC+G24ShLj\n9f5mLZ+q5wrLnlDA2pPe5pqd6K1PDfXcwRconlfD0OTznujMVMqdttDN+rDb\neIHYlio9AUGIBBQyjjxWG6f8W4GXWNFTM9sCNse9hh6RnrVI/8Zxqs/V9nF1\ntLitH68GTGSV8nz0LKDdSNq0uUPMlQAR2bg2Cja1/O/vdH3vM6HjRSbjV3Bf\n1BL1CBGRETFm1uuIJnz90/5XB5q5DC976q+zS48Cz2qKM45SnKOcNvA1NsHz\neiX2rBGBzfILuqNrqwPwAwaayPeA1BXBPhT7JKDGIHJGKDXOAMpwUSoDLNvZ\ncyNUW6SFJddOmKKPGUA9QDk/0Ys2pkP/ug/Vzd/EgEnARcpbSVTBq2tBr0Oj\nmV7mmKSPmRYNjg9OuZYIp2/QdcEa2DNzHFlnwTuEBrouA6XR8Xknp7ahh09r\n8oDZ\r\n=YWfn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDSajOgCX4dUekw9u566kxRmSiRY5ohRiHBTnwDyP7IjgIgTAovihkwmETe+OMRo33mB3/Je4Q8JPTC/pf1NDIMWoc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.1-alpha.4_1573480828780_0.5753005019490289"},"_hasShrinkwrap":false},"0.11.1-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.11.1-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.1-alpha.5+ea39f18"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ea39f18e6040e649e663fe1e55b8eb901bc56202","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.1-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-lhiAPz7pV9/8aD9WeC2SVi4vuT2smwGgAmaY5e5gjzMI/oyq3cHJg74py7Ratjn8eyFZ33FXOR2JeQtu0uBfhA==","shasum":"a5556caa0a320670967aaeafa645bdd7e077a720","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.1-alpha.5.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyWqnCRA9TVsSAnZWagAAUvkP+gJNYf3ZeEXiZTrfcRKF\nuMMS3HewBcLBJkE/tZcuuV2Nh0RdgvbYq2TTw+CIoItf7ESXTIv5XzIvet0j\nYsZQo/PQneEhKh3E73d6sQU3Ty+tjTid+Uc/SqiGc7xkwR1MOWj7FEfPhst+\nXPUc32NkJlIYDmVe4QfQ0yLjee03F35kCI1TOc2crDIAMSoVl1Zvoc8S86RW\n85TTKDnL/uUiV/Ur4+6ByegRy+zDwmLqSuOMr5+3GO/VkS6xickU9RF+Q35B\nuzEWgw9JfJjhDllxYJxqUON/wubrMkEmtqk3K5aUEczLsR9QG7vx+FbJrYeX\ncc2/HaQBYpdA4oq61aCO3uG+RcvmgpsG5D6qHcb0itR7yYc5SYcU2HNlsqzW\nnqsmaKoLnHQ4ZkYLnuX0ud28rxUqBH6YTAkQfn1lxD+nhDabTOwW/Rcs5FVA\nZi+xRKQ3qznIBHXNVKMLVBUauoUELbMuIJlVXCGkrnwinbzQgSqxl8MTjuaY\neG4n5eTiB7FUF9BOwsO6I6Mx5qX14heu58xnMem7S704kTp9jPT2iOENnwhU\n0NFbBdhIVYZxPrJADwPmMoPeACiakJumWKAHkOwJKLvCuEhhUhJMTJJKZDHj\n45ZcTTrhQWbZhHLMjglVjJbdolNlskP23i88MThnvIj7yxb3E7vdXcNQT560\n1qLi\r\n=yAqF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC4DeySVYbjsOnfcpcbh0s2oNOsU+dmOxzXC5m6bNXuiAIhAKopqvIpFEUKerxrxj6ze0rpkdPF/gaNVqgsVBZKqrz8"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.1-alpha.5_1573481127041_0.2942075524875394"},"_hasShrinkwrap":false},"0.11.1-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.11.1-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.1-alpha.6+4618308"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"46183082d893ef1d2037ac1c68603ffe4ab9f4fb","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.1-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-CgQ5XbULM1d3kBQXFH00A+2f1DhvoFHGYpKKHUuUAIzn/WS6dCZFCVf29TXj5Cqbv+wmo1WfDAuUhxsFAKIyKw==","shasum":"10c144615008877d820879fd9ba18757a7be8157","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.1-alpha.6.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyWu+CRA9TVsSAnZWagAApIkP/2KJavm3H364O/Faq+cA\nKk3WC5zVZbw0KKO/NCJQ7bVLseZ5B0z/koUMvrf8hQ/ElJkuxXvq6+tKohWU\nUgnkHfLPNr8DPzTedSMUygyoeIbv+/YKH34vD+6KQq8YVnHibtlTzoZlKHnH\nIo8GpxXCDxeg4jEPlxzfjt8KvgSur2AwMCMi5GF2be8BgyK+hfTIwKg5ipvn\nIokfbAM/lnHwVPXAVlKwLSEDTn21zAvXOqizIc9rXg1yB6EFV55xnz0ayFkW\nsTonFJdDsZBIaZNpECUc4vZtPY1aVx8/3H+GuYV5hlF3ai9A7/UkKVss7w+D\nHNMNRXaxrnRIiNM6kOUSDmah/L8uO74+rkfDvSrgAk3kSeOURJ0UmgBXtGxo\n0UFjAmwlFsMDSuGIQsrBYxWLpcOosagvc36Al2MEQ8ZF4CBmD3zBYbVzou7F\n26vIi+uBgKajCDYyK7sFoUILi6xDOFrH5uYSSV+NZj9hVCmGPscdKPYyblTS\n7jCpJjiGkGALoORJlfip3WDvsr8jj0PdoTVYRmPlAiYUFXaNwkOH/SzEiqsK\nBlF0qYhze9uR7K/A9YqqneXKW4xKAeJJmU55wYfS3e0t0yiYxt7GTrwOWW5W\nK7Sgi18sSrWR3fpzCqYKB53rJLlBtnpuBUwVzDxPdAGfz+hvUegdkkbWA2o0\n8odu\r\n=Vo8U\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDLofbGbjd0t6b/jtlqSUiD4Uy4WwK+VzXk3pmiLqp93AIhAInIf7w4+VpDCxgLj6saBPkQgOtMZ2/0M45IjniBUWTQ"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.1-alpha.6_1573481405766_0.42421650090199536"},"_hasShrinkwrap":false},"0.11.1-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.11.1-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.1-alpha.7+0a4a014"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0a4a01481ac2aacc78800816eb324d32c9646868","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.1-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ciOGtphWrqyr2PaObHpXCIvWVx5fL4SFhW79dg98NVuqCjnzg5wBKs7U6mJUncpKYipYdfx0jRt0qbN86NbdDw==","shasum":"bcb3caede98a6429edb2611b2f260d7d40202893","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.1-alpha.7.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyW1ACRA9TVsSAnZWagAAK28P+wY9rO4miNh/Jeig7Ct/\nwB03r2qbVJ1uWHCRw4gBbx4vJVhjxFYjd+gSHa0rMwQ0yn+tUClevGPhJyFj\ncwWdrRh13uDMj49a0HI5Lytl1wy6UcEksjmjx9aWBLSFvUbdiUAh0ASa7N+J\n5J+KmYbmRPHO8AyO6n587jwmGWqIfGve3wM0AmoylRtL9vWig69NbBBNeAF7\nK5P94f3Ue1EGrJyK8AQmOE0OBbvHZp3E/kFe+Ln1i4y1C92olcKEc6PD4kwm\nlUvMS+Loz3LgfwOpczRSy5HW+ZWxmKLN2sIBsS7YmZIF02gxEca5GM/QVABJ\ndS2EEdzF9O6Zw18eYInxzqDFQOOwDTCDrDb/+NyST3SrX3Z+8nP+hS0Oz5DY\nxwaS/D3fhex3/5sNGfHELuALqOAKooNgJb/clduD/N2UEHH8/Ifi7TnV5e/G\ngOmc1OZJpwxnquNBsSgVHlw0WGxkXWWUdEv3Uo1tz8HQvo7AaWplEqLzJ1bU\nzlV+6niYCY+3So8MdY9GywW1aZwXApQ3h+TmzX+QqNFI9a/z7zUcfFaTAMEO\nCM+ibabl6OfysUsweF5mEP3Mv+w0rgZM0dDMe7Ty7C5MWzc08Nh+7jKOK17B\njhYF0UaPKxi0L8tfCrDhwyzASv97yqe/L6KDYTajUO8Yh036mRm8E0RvyxUP\narbZ\r\n=OCrY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFJEMNNR1yF+faoKKKKO51mPfDzGr7dtPnCw9XO5GXozAiEA8TwD3VNzmmxPYR0hKvw2VomWI64xigbBQP/WsoC9Coo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.1-alpha.7_1573481792306_0.39243917673350714"},"_hasShrinkwrap":false},"0.11.1":{"name":"@react-ssr/nestjs-express","version":"0.11.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6329a5a4c64ea9ad1959ba9133a04d96c8c20956","_id":"@react-ssr/nestjs-express@0.11.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/cT5xHhXOqk7Q7I1f9g978BAYaVrdrwh27E4kLAehacniatXk6Thmi/p24eg2Efz1WwGY5FVVeiW8rxdb5Ygxw==","shasum":"a01367c8eb6ead987dab1e6ba57e29bcc9103d92","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.1.tgz","fileCount":8,"unpackedSize":13728,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyW3PCRA9TVsSAnZWagAAgyMP/2YnbkRmkBv7kmYof8sw\ndoGtrg7G9iNbmq4wtY5a3EnbX6zqLVwU3pUhq8sGpn2LGgThpRvveFWMJ22E\n49Mk7FVOcgA+i3uluwvUcUmc/XuzrP7WCZXrWb7h9Fo1LggIUrDRRjgU/9n9\nB89iAkkrYodMROXK/BMs4+UljOvuhz0Bktgvq77MwvhF2ENK2P2fbOVVyLVu\nQTrpxBJgLIdWjBifdqv2yht/fl0Kcy3g9ip4nvpNOW0wTKkbCMOGWVaoImM6\no0OhFdISAnNofT49f4lFCMKj1qRsmUrI97CBVf2t/gNm3C5lLBrJHMENk3LV\n3FQ/pO3ZqqV1jvukNug/zk7Qks90pKEKZl5+Y6Ons4PAqDQ1cf6cg5RLfLBJ\nq+jl9ochOpepv5C5SNagernsX/96R8M1XjmYpAIRUmpLMQvYLH2yW5zKU3Uk\nVIqZFCfYcXwHv09hnMuc9sP63LJiyOZIQ52ir/aBtoIz3ZXYWBMC++6maJ7S\nTEJjaokXa4bPKg6IGZaKHxNuaW7Fdu71BsyuUpcvU0kb2MoEka800YSKVcH7\nCg2cSLAevrxgSYWdKUg3eCsI0VV2yWLAMrM6CDjmSlwi4Jj+TlH0D6Ba8d4n\ncaFY2joMcBhEoDYdlcNRFG3qJpCn0DzADgIIpANQkJUMTxG5I3Csl4utBTZA\ndeOD\r\n=SU1R\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCfI2+SMkUocmGLEFooWufHHzQvaSAuCF5QLmVYIAc8cQIgSm07TbvX6n3S/MUXnP22UcBdDr8QM1Ga0TERe2TzXB0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.1_1573481934858_0.07523443547510889"},"_hasShrinkwrap":false},"0.11.2-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.0+ef9545f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ef9545f24ab2097dc0ba7eb023f75bbc86cf131a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Lu86UQwvuO2bybucMAPuJlua6uR190LgkzRNUzlAMptzpm4bvH0pm7l/DrR4jEKaeDn2d1Od4bnRTtiEZbJm8w==","shasum":"ee5028c291d34fc5dd65689d006e40b3bf98c364","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.0.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyW/+CRA9TVsSAnZWagAAh5EQAJbC6EwTsNaHiewBgOym\nA78M6wjdJojLo6ZQt0pBTubzjP66F9lXq9addBDHFmMOyOsCUVJWWIuGbcgP\nuMlcWoe7KWKhZbn2xywNWAvDIj7YBlW6Hl+uTHjdgJLuP8remFs0xJL677NV\nEJAUxgAINSVZiC4kPOAsfQHRbYWiOh61tsm115+N2jzCtA/PorMjbxHQiOOQ\npL/poFnyuouIj/3Mtzl0SW00UE6vAmKN9WS6BiJDsIdmu/I82Vbmz1rLYJU9\nmH5dpz2J9Rb3wzmFiMRe+PWL/Z2ocv9YCL8cY2YKEcyIYj4KrJU2eSE3oGh7\nF4kY+15MUMUVf0Q7+FE3ktSSdHgw1IHN8C6L5Ps1idcCMhs0Pv/5+/Y1r1to\npiNILC9pHCIzqcKJJcGBN3jbzYlSmioTfuggK+WPq0PTaNUpPHNe6DzEulpo\nI9QFTiByUlP+urZHqf06XoFW50PskzW51w6yFP4zmd3jQ9NmGJ0nvTy+y+O5\nyM0VUAinEC0+ptb4MEsLQeMbAF3jl4UCPilk9VFoubgxY463jf1F0Ex7ZfOK\nWGEzZfgXQmRoLhxN8nkVVHklxMyQJ8/3JakEwXEsI7E+WrV44w9hS+jXpD4m\nKKtGWhYhOGzvKb2u1kySJQiFJmSRiZrvt74xrh8pzh+VqyY59f8+ke/CKXwK\nb/3n\r\n=YABd\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCeQsQ8TU9ND6wGusjbUDCaaIQ/Hu7NwY/fpRmz4TOAmwIhAIc/IZsgCWAgMSSUNGFOPAvz1MWqGUVCYF6q/X0i8hSg"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.0_1573482494604_0.21101660636477804"},"_hasShrinkwrap":false},"0.11.2-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.1+6c81f75"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6c81f756864f6758c4ec46c463a75f58d0269d06","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-urZhPwZm/P+BAyILkr4x2eJlP03m7GdAiadDg2+1LeKtlQrRgioX4meQVWecwUNA1TDyWmKR39Z5LWY7lfcbsw==","shasum":"f1fda0a8c16f09a399aef5c9d6046372ffe0d72f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.1.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXJiCRA9TVsSAnZWagAAxrsP/14tPE3O9WinGyzS6G+2\njCClMud6iAEaTjRqbeTO2YgmKP5jGqXP3vQG8VFOO0xYus8QW2g7W7nmJKkp\nZrLWNjeomvUHmfDPSNVAF5Gx86IeCzCxpt1lSpeXOqN+9YNZBDwPdgJfoQ9/\nCQ1Eijb8ZJD5HyfoTV865sVtdGCd//XV00pZAIke6GDkICw6Q7RkCgP1CnzI\nwwBTDLCU+w7S5lhRGKJwnAcur2AOkLusyo2DlQWr0J1QDaaIysBaYUW2wJg8\navhlQKf1pVL3RreZGC+l66nfGaQ3Hq8/oUwdnhVk0+WJA8lKahun2zx3ryH0\nPIR2mXkmLEJwJsVSZnsSLf1Komq/FWL46flv4CJ0NJwZO2eJgdXY+jpNQ05P\nowHAvGuIWoF3ITI2KwHHkh+AKz3LRWy1j8rMGmrXry53MFnd9J56ApZUAvby\ne1MuvhRi1JIOTuSBvL7U3eELlSFXrKNL8NZ0LDIvat08EhbsCIcw3M+PlNIh\nJLGfWtFyy3lY3Pmb9OdwJ4xoepvCuonaEVf48R6uk/NUNwe1lOWBxbQpNud7\n9RBvR/nKw7WC4NaymzesoJ7cz46xcHAvfEHxXerXQyxD109cN6fQOUpy9lS5\nvaBfZ/tGw7XAat2LOcEjyhn20cvwNtX6Xfy2HVdnio5yn1rKt1u0zBfib+B5\nZxBr\r\n=1uO1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCUh1IZDdgPJkyaViPfyfTnWpIwyy5Rg+0ImOLDhpeLqgIhAM/9WYg0CamuLozQoId3LkHF/xabXMHSQodkpZeSoo+g"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.1_1573483105975_0.13300392317644372"},"_hasShrinkwrap":false},"0.11.2-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.2+305a342"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"305a34205a3d03b15ff2e74ba0796ad0b6737132","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mpViGDZj1tBy5hq63gdyvkWUUKdBburZHn+NcIj78htEilSsnlvkrByd66fp3LVrfvRuRXpxzQ8KHaLMoZJOiw==","shasum":"3fb51067ae5a3f173128fc6316421a64f83051c8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.2.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXLXCRA9TVsSAnZWagAAr4EP/A5i3CHINZ+mNLFRn6P8\n9eeN4gSeYHUc8tC0eyCFoPBHVvaefq/H/TEaM3spe+2jJ0W+YF2SfOQ/1oJO\nF+2X+zWdnxk6hrE1y4wFcRc/DSAnb+40HAjZchzNstFyi6jQ/i6vYpNTNiMY\nz6wyQXVuS7aOKuZW+gxfWVNDVqubGgQZZqpmOnyL+23laDEKJq3AQQvMcV4V\nv/4irdyzSrbQKMMRJeMesoxpboh7U6glCGtKmOqtPNTvL4khk3H3Y+6oXyKv\nU1M1AndRF9E701999dHlVb8pY1MySqazr7T9+U2qNiMHu4G0/QxlJtlgSXM7\nz+GMHMD00LhD6JUJIjr5YI4rhlp0qtXOfnhjUJtMFl36Tc7A0AiXf7JFoNjB\nTLd6WP98h7Up6vmsiIyqGNO4exAnbPzjTv7glxtjdNUdOwadkJznhUpsjXtn\nhOxnB2ld6lr5D0pM/mTZxCfKDfsz3q5F6JG6TlgI9Qij4ruw2H8tjY75wBpC\npXhETh8KTE0b4VwziVMqvMKrHAYayQaf/mCJKjakGpN7nBWnXK7R5jR2Zf+B\nmx/3GZzkek3m/pi6eAtiPH1WnVK2YZ0kVTE4QIuohSb1FLeqQetPGPKKblDU\nbGCzMeaOQsBF7amIvE1SS7tIpzE3AgyN/0xnyHrnoDdlys7ALcH662XNRl9Y\nHFC3\r\n=qQr4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHwjIl17cs7uPaNRrulmaHmxfQoKraMhoDbIYBrrJ49+AiAdh8aVAEyhvnqzZIwec3mFj/PY9s8b+XfE6Rm84InQAA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.2_1573483223199_0.0840430598615971"},"_hasShrinkwrap":false},"0.11.2-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.3+3468d22"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3468d22e4e9b87a067df9be229ad3b876ba0feed","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-5YPxAGO2JftCvD8ESPorFNycbi385ZbgeaDfnBwlalaWOYNOuxeIM4p84lzv2FZwxyg0LLwfAAU1noLc3j/GBw==","shasum":"c9f8ccd657472388692624f9efffef4209a5ebc5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.3.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXS6CRA9TVsSAnZWagAAdUcP/jnZwYmGVECCRZGj/pvY\ns4TWy/DFzlZxCm863g4NoK+CJYFEHXHUMf4HkSgwhsRsVpqxuTv2qHhXUN+7\n9rAFG+9UGBb9X9zm3KaB0AnBswP0kkElTlCi5GlQ2UWsgoqqkIA+4P+w8sQT\nreNr0OzjRJHcHz6cQNMKhk2ovJuuvf66B+DlGSInhkCQxqHVcZNP7uLX5VuP\ncf804o4h2q7/luAXSR78Wsft06KJN7MIJ7hEUYGsCKZ2vPtsIMX+m84pOb1k\nqirpPAWN1pA3n4loV5WwM5wvj6PWAUTtwVeSC+/YXLLOu7obvQuEAMEA4YgH\ne4ayTQb5nd533r6TYukmtRzKSwcj6aWbyioVT/wtupSs/h4QCRIL5HhoOVs8\nrShd6FT7GDURDvF3hpSdq19uP1w6m9Hle/rJP4gKcH2OJlIvUO7DtILVIlpk\nTo+UKYhDzmaCZSZoGbxfFqpLq928lkVpgnrJqcjGWNrwyeGx/tcyX/I825kw\n2+LyWG14q7vbRpTZW8+Se2PshGmrsJClvRA6p1I52Jvs3DjPduD6HSXoLd8a\n2Rc3IbZ7gy/91ITFHnGc8MQ4vu9IHv0tuUpN5ro9q9K88OKT7Nh2c4+DBLt4\ndSsmjtvIXYWi/M+TT9sdUFJGBL1JR7B3mKwoGK/nkGPq5AHscpT0iE/hSVTO\n4AbY\r\n=5LaA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHY49LMXxPN6VnztvcaMfae+bWU3jbiBJsqGaidd86AWAiB7s3W84lV0kDbLVPzyOfwr/mehyF0GXv+jX0gGcg/b7A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.3_1573483705733_0.012921183877198983"},"_hasShrinkwrap":false},"0.11.2-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.4+441b5d6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"441b5d6b193d0b077023fa0cf37b1bb8308fdb23","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-VAJGx+jtdTrVr2VDKhCHRenEOdhyKddJcJAdzrKoc1Ua4//LxTk+Qq+hoPXZ7Lrq0Mohx26G6spmPk2yFQa/Zg==","shasum":"212859aa0805e19173a97ebd1ced8f042ac074cb","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.4.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXUWCRA9TVsSAnZWagAAltIP/0B/vcTgasdL8OdvbF0V\nir6PBJHn7FLggZWfiGvbNnpE9tYNce9bgku0fdzmynEws7IRilDE81viBUc6\n/X+obf2aI6RdVq/yn1aQeSFVh3kw3P3386C2TPtN6ROxcEoDpPhAwDj7bkVJ\nr86pKxEllLncl+UkfGr30lwAUqj5VsFs7i1yPrCS+DsX5CTEYOIF5JhVvAfk\nfQNXAz2wWs6u0TPZoywQ0Rqfm4bIVqkA5Az4Rh1+ZQMSUmImpyq4AW6kvLma\nUUjTSAqMu5WRXHBpnKkVBsfk3/pc98zUTuyIQVtsq8d8TR9yk1N/FOoqu+l6\njFMk1lb28fN1AJxWtoQYpffo/GtXXCu2McexZoV5CpwhR4Bw9RcFBA2TPtCT\nR/u9oH8JqVMOW6nPlnUJVuf8vXK7ihL4UHrMMumdI22Sxl+4a54IgYzCvG74\nfPDBveZdJTHPhlliTYjyw3B/yDQFCsIq+4+kuV7pGKJ5mS2y9Te1DjECxuRT\nKe3HCk0jzP8iOdQNZ+wRbgUODlqAv8m2Sz1C6q+vtWKwYgkCtsr0MV3foorg\n6DyT6Y0lJBsNV7+9aZSgrwE8WU6t5ICjVx5bgryjcI5zDR3hGw4TllVX5Ual\nAe9DKImQFf2AujDJc8XOIfLM7qGt5IWiLu7OLjQIRsPIFA5J8zpoWG0qFPmg\nkdMY\r\n=2gGa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDEVVgd0dTcJgZNHSP0lifoLkTxAG2k8GEnuzv3RkmNFwIgangs2247qY8vg5bVtOFOEj3eYBeRzeGl+v0DKG/+5OY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.4_1573483797774_0.6903786069495768"},"_hasShrinkwrap":false},"0.11.2-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.5+d006483"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d006483b0d92488428dd9ae768b52d94ca995811","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JGXnLVqsUepnHq2WI3jDbDCkV19JpRQ8E4TOYcguQ/O2IlGufEtovURLm15kzyebA5ga7oWAuNbt+H6mWEEulg==","shasum":"6fa4962d3dd5d181f6dacf628f743170193cee92","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.5.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXWuCRA9TVsSAnZWagAALvEQAIlm/4EQTgAmTWC626/n\n/HBq+0AYLcjDfVFM4bGdXAV2FYU1TOdlXSb6OfVAf3I3oSzax70MOeqhiWp8\nDxt/D0io52P2YMk34tWlcxPw5qx/s7fHJMJ50qiplbNmxSSZbt7evpY0gccy\n2djm/iykJ7r+3GWzWRR0yn/zSPm9r13ZwHWvtxSqvB4XRcQtgk45HpWn0Dly\n/rb/HSWUCo92eXPmp4dD2uMCNl4q3fcOQ7GmvXszAc3+1GrwOLvWNrZAY/1e\n2TJ7zgoKKYNIDC73JtRVbjeijD/a26T69wQdEweSt/hMsA5LMThLIXuYhFU0\nypJttgs7nCqpdHTwVKfl+s7/ggghlKUOTuvb29iYvtLKbZlhhF+897Dm6dD4\ncmuJlguwQzyltRJKwnaxC/gHqSXvkGgLqdF/jdVMU88p5o/bK47Y8DSN3htc\nueAajggqlAS1FC1DeM8kryAFAq/fby6QgVWhu/9Jn2txHHqOJtZZALRCu4PN\nLfmpN+oSOVUOP3ihycKb95BaT/fNiJoPU7vkNPFpXUbhi9xMo46EvUXy5pzM\nlZwvjK9kRn55HUlg+MbzP5mQBxLaAbC20ysoVwvBUdxOGmmFNxYGZ0gTguGg\nDOV4h+pKLQ7CzfIQjYlBbgP4MTmTJdo3D3jNOJU2w/zYq1RF83BTIpNO9r1f\nQW3u\r\n=nDc0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIERI79HZXhObefWo1U0VOcXO9xsjsiCrvv6X54jMG2gxAiBl9T/B8j7hY2knTr2DVeYXUVzCcie2zpzkRCnwo1um1w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.5_1573483950412_0.5432792166938674"},"_hasShrinkwrap":false},"0.11.2-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.6+e46a9ce"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e46a9ce1badf719f33fbf72e8a4ace769d0b858e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4QTKoC9VZVePHjSGGAUaaBARJWUDbT/c3Q+egJb78onBRWD8gONzP71k3g37DmOc+73FCKOX6eQrf4Or0o7SWw==","shasum":"a02a998a74f2493be28ae1e64785ebffc6ab7c78","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.6.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXYjCRA9TVsSAnZWagAAkEYP/i0unkq23w3TgUguoFrY\nHBGY9j3GesRtAZDBnTwmPtPagyECrhbpodrYtYdJcU74HTOYDL8vLOMoE9if\nzoass6R0diOPj5HB2N/NVzYcvinu1l5ww6p/DARx5KfaVzrTe0a0PW0bvIhe\nAMSUsuBx2ldf/bRpqpP1EXVhXuZHs7pgx0ySnNGh+yjQGcXh+q/GKdWleS6Z\nzWcpaoA6qYCrZD+NgQwJbqa/7r0yin3OB1W//w1ajofHz4rAfBsCgD6kRogK\n7HLCoxVsFFDLA/4NjAX71P1RD+BJWJg5laUNg+MRls5Ov4CtmjL0fSYhZriI\nKjGJdbW0JQPM5X+WHhqbCyS4E03wnLKScvtVpX3unkMWnlXKBmHsTjrfwUqr\nR7AGohliF/lduJGiJMDvCYUnLCuqUzzkCigUz6xPpzCeRaEF3oisrkLfZR+8\nRsFOP+SQdkm6HGS99u0TDDQAh6WMzV9wH58NozUQxtKrKJMmdl3VAc3rrSd/\nD6IP4Hibm7lRq0a4I0rfz5YP5+wITbMH6xtCW9eiXw+ENOrihvefghjWs7HW\niLWZQ6gHYAeIH1PSBKyvLYFr3GigM5yMazsKFS5aza9yuUhA/nOqCQrMBRW0\n4FmARw7e7exwOyPrQ1fqpTTmaOu4CftOfkAOq53dRHFsY3HAzkaZH6Pm7Idq\n2aW0\r\n=MweU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAQLymYjIRe6F/CYwTxL0YRHZljUiWuYTCx5frrBkQ7fAiB8UZhjuXukr+IdUYszIR/VJ4sqySTwQ+HKhM/AEy+kgw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.6_1573484066996_0.13131166230769997"},"_hasShrinkwrap":false},"0.11.2-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.7+18e70a6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"18e70a620cabd2fb4c3ae77fd5a20f6f93de6635","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-na+gE1PkLXMbyE/AFuJsLvt8OTfMbTnp9SOAmYDlCwdVImDzYXDnPWRDmSBd9cgrtHC0oUKPstMSJbcSYDDjNg==","shasum":"58e08dd841fadcaf69f6e4a05239101a5282ec91","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.7.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXe2CRA9TVsSAnZWagAArMAP/iA+kFlAwSvqrOpixAqt\nXGmzsbF/P12tr7h/9gcOlcJk996Zs/phj+Kk3eVvQ4tiSQ+E6KD0N9eha18n\noyiqmInTWLIHEBeGv1GL9qVH3nfhSt5Pl9Ra2FVmqfJQgmo0D+erB9Qffvyo\ndmVzFYoiwMC3M3H+uPCjGxY7y6vHp+7IQ4IB/ZP1n3jgLvEszwe6L3x6sR3f\nBcxyMfiB7xhH9PJUPFZGQIqElZapkOai2oWr00JWjB9sxbth61u6f8XgDsZS\n6/SmMs8J7Aej7NXR+qosD33Rt6H6vzcyr+de0cRYTbHFLjOLqTGrH0eulj1g\nnltMbh5qa9PsimC61fqUuj8JI5qsO/mI83jAsyIYfeSfJ8TI4foAYOLmBVfE\n/nhH4NQNOyteo1rUaaVCp+Up1goXY/r+Jy132RWTz+Z7subni+ZSoOgHh5F4\nN/sDigrnb4cLEcm0B3fi3syRUnf/g6gV/XVFbbMTay/1fDeUBe0XFBbeef9H\nJl8GTKPgLSY64i9cgmzb29bheP1neJbJfS0zZvQUCntrkBSFnvhfG4vOPmCg\nOAEys5hU4W6W9ECQWltMTe3cC5wXyuD2U+uHWRrM1aPPnSe6ryEtiTECCbEP\nFxdUK8PknxT8BuCCxFfHNbcPGLb64u9bIe2YceJvP8Kc5T23EsUHtFNPzHs1\nNkf+\r\n=ObFE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIC9jVh7TSIRaoPAZrzM5pOqRwWxcynInQ7mE3Leny42nAiA0ByPaTeOucIT2nTfIYdE7GETzW/M5puNBRbpjwnwEtA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.7_1573484470324_0.019292148080974902"},"_hasShrinkwrap":false},"0.11.2-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.8+e8b93f9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e8b93f9e6a7a1ceca331745c27238b4a8e58aba4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-13CIsnJZtC6zNrtMbGR035G/AnomnWDrvRy6he2525dZEQC7eu/nd1HCM/i7eC1YX1uf4n8P0vrMB/NINRAxOg==","shasum":"b277b613a700dd3f72f099dcf7a0fe46879adfd0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.8.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXgfCRA9TVsSAnZWagAAJ0AP/3FUJnWa4XctjBU3VEce\nT5MjaVnx9qBg8OZBk8CmRXAzZc/H0sspwYkwvzDuVsdZpzJF+H8AwlLGIP2K\nGaUOPgcROzZpzXlnTDIYZB6QWR7d1CMBeSV4QlEoVlyY2fIrUKAODkvZPmAQ\nxhlW35Qf2hDjTmCTTgOf1Su5HxYXXoyZpELOjZo2rg3UWoobXcXJDtBdgimE\nP/D9uQUgwMQIKNR4znF/OYmPx+cdQeXw3zoMiEVoyZ9GtpkdaCc8oGbr22sX\n02OlYR0RZRPIZTn4J8XzLz623EJ11A3PUlRvaNoHVLy5coIEE++vLM+1dFeS\nHUYEg7vSaXfRiL7Iumiao3V4KeImWOppznJ4H/1ODRcC4Akc0di1pf45aODB\nx81wF44OVX4dHk7grRPUd3AGrb8Xk53MPGK9EMiCNs61Wkmoo1lDY9wu31xR\n0SY++7U2bQzRmCg/LhKpCwaaDo26k10Y42QHB9AEASRe6oYGPeAPcf1zlPxV\nKUdWf6yjPzFHDgsZg6n9Ndm2mQUzptwIkEe5kp/38eiAirTH8hJvxrumlV5H\nYlPgiXGKb+2Lp2/x87KZXxI8jfgk2ZFEn3Hs5WAhupdBXugGU7b3Wn5GLrMS\nmBLeYTTT6OIOViYAEMrCGtl7GSQd6NHO/m85BQOd82g4WnkMq5KIiKV8odq4\n3XRw\r\n=N/mm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEWE+gb4WgruR/XrRDmPir1dJUWd72jcz0jqGWoAMo5oAiEArEEqq3t6fu0fUpJ2u/k5EX+MVUGhOI/BxJaWeMDCy4k="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.8_1573484575052_0.7674454317194639"},"_hasShrinkwrap":false},"0.11.2-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.11.2-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2-alpha.9+4b74ad3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4b74ad3d1e1d964125c41704a0fd4a753d558c0a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.2-alpha.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-5FycnszyAZRR+7MHL1YuQUVzP60osAzZ7UlCrNW7hJvWgmsW+2epSfVZozkvV+Wj64EYwv0876SrhI6hCfyHhw==","shasum":"26d76cb63cd71b640d24c9201f7346694acd5b7c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2-alpha.9.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXjHCRA9TVsSAnZWagAArS4P/3MctQ1n5oeUBrrRqqJs\n7MdgFyQi/84YjnyDDcWiwIxGdJqGFOD2cZuK3vlDBfEAsxicHau0w0XqgNVY\nKg3lX6gdJvyTePXwvNthcFtfBEgtXq19REgOUlXqdZ0TAHTwb9Zn2gwJGpyh\nzU7yOWtr0CyuhKkP07S7iEBcN8XqE5UuN2w7QVIQCgbYFFMx6mxMmvpTtDr9\nkNfDYdF0LIAYXgHm0QRzNf6fZdGD9C52dbvrFu1uwlTuYhwEi9POQ5IaQkUq\nS519iYijMQQvsquUyWZxz2EvVpq2t87+4vqp8VNQwdvaUVOC19S/g28MVJpq\nhMjdcZQ3O9z+66z49c/cujC1CyJP+fpKBpiEdQxNKCrkaWqwIN4hhMszMvOK\nup8mbfj08e7ceJ8OzmwRlYsy6PKuiQGUYK3yR/z1EdKAN32won+ycSz/tZIy\nutkEHLaVJCng8tuwcsAubMHmIQPNQZpnnPLI9ryAfdfZc+gOESzkJUVz0dbv\noZxe6pPUcaLbevlBFgNBGP/IAi29/zRADOFSbJRDlmNm8Vc9PqaW2hL6siq3\nrREE5N45RM675zrojZYhbXICQpdNAaqPAVZ2YRlj/Efji4hh0AhWbx4dYiWf\nzpJPR/mDBPtmT9H7K+P1x9zGlaGpitaCAYyf/CtvM13wNeYRoyNUFD2KORBH\nLx2S\r\n=/dZk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC9QyhgsqmTK1ux/Kz8UuOh5hv2oLsFPn1sji2DD5Xq/AIhAOTQmYVjpE0/sUj4pWvH5/dgpkLGk4m64fN4yHYroTsm"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2-alpha.9_1573484743397_0.12601483697905658"},"_hasShrinkwrap":false},"0.11.2":{"name":"@react-ssr/nestjs-express","version":"0.11.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"91db641515705a0a1ef0f036fd3bd102069efeaa","_id":"@react-ssr/nestjs-express@0.11.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-r3fIZLtcLoYqc10v8A/0QC3lSqxh/zdSdXvuCWDFdQKGhyKYYI+RBikjzYi1+XbCABN/6MiixoE9sbDQt27GOA==","shasum":"fa5db5b220412b0cecbc4df5dd99d519230d99f4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.2.tgz","fileCount":8,"unpackedSize":13728,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXo+CRA9TVsSAnZWagAALjwP/jKRMrKS4+oEe1JzFbSm\nJzpRzfyEpU7+bR9ODTP0opr4w/7gbN2/0xkES+eMlf/fZgNcEWHuKM7OFd0C\nfmatSBNTs+rasQTNa2raWaETQ4cUqLa/6DtXgBO05CbOb4Qo321pAtLoAx3z\nA1vNe8jWXX/hxWg5RJ/ZF9qdjL3rgMSSccxk2UEu2koUi6wM7j8tOJwT07gM\nND4WxUd50vUAiQDW44S02xcQGdD9e8EKpzyuikCsw/9izOMfnm3MeZiE/pcC\nBXa8NNL8xLXfUzau8ye7xd+xaArQPoF9e7sTF4NsP9LGPvhDTP7t5eq7YKL7\nouuniZj6DCJnMc6YTlkr75xXmTscWJLZmOHkXXJMbMx5hiqjtieAg1eJrMCh\n5T24CNgq+kJjT6JDJmcx5uqO3tD158Uwv4H/htGOuUQPO1cep4zOH5C0weNN\nhInyfG0oTZQ8IxU+04lpBLOjv4dsJ4cUX7Z+H2dHPdCV+4qikInQbVtFLmt+\nKDPoC/o0aUUL7DLo3UNwcFAgJak/2R+EMFWJGOpWrPMcQQDAxzpUoCAm8kym\ndkD3gYyMdLOFn8Q75fsZacRLmdivqL2IamUxUXuVpSyj7e1Xe3EjEQqRJOIi\nPntGZsSOuzgyoNz8w2ST8sKY+A/vDhvp1RuxQuTY/HtpCxkiHrl0P4YLhdhs\nOOol\r\n=G6jE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFOShvKtf1LbkKXhA5UYqs23lHdONKQ1vTv5cJUoXnvJAiAn2B9z0BRn2RWBrMTOUv0EmSqKK4nFmYZS/CVZtq/EYQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.2_1573485118300_0.43614275286439197"},"_hasShrinkwrap":false},"0.11.3-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.0+56b2e1e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"56b2e1e0891d964895de14eef6bf658df0ba2292","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-6sEzu4nr9h4sOFZNDVyepGxvyecSq2rcJdiCJQ9oJ14PIDlBbgNdMocZiicchCScw5L3ZY54B1fbuvIUcchP6g==","shasum":"c4eb3ea84d376df76b55e545873b80d59d06b5a4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.0.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXsiCRA9TVsSAnZWagAAWdcP/0Vr8a0VeriTVi2fwTZN\n7tFFSrBWh+qXIvPNGWs/I6COTL+LY6/Oh0ShjfIxP6upNgKZl8JulkpcOGE6\nTuu7lhCp5rjSqPvlN9O5J7qbcCGmpnjDrmndvswGMyiDApMTkQ0y+dy1LS/k\nKGjenvDI11f88X38kW5sLuriSLC/od2CdEzvhugvA0mPT6NGvzUhcZrKK1dR\nEAsD5ogwrLFA+edgOy+e9bmnhuVYbCs42blEH3JJTPnZnJfinO/kdmFrEkl5\ni4HsixSClcvyElpJmGNoukyXP2GZcjwPEdH151F6RxlPMgtsv/3zY0XBO7Hh\n2yUhKCKuXGwc8ishkMfUMbeRXWpwqajxO/mwOdOfCdQXVm4Bl9y0fdxrsOvk\nl4mwKyPNROvVB2JwgtuNU5jPttgk56CEmmGzp2J4Xrtyn9LF0vmJIwHCtmUb\njkXN4GGr1CVGgiSxrvTo2CNPTxSIE/oK8nBJbRR6t3zP/XsT5N/bTd6L02rE\nvezTDbWDoc4NIPXEAa7S/mZVRFQZVLmbUF7jhZRT6g7Hiost2ZaVvyKNa6M8\nxfLNGG5yVIvzn0Q4YoVJQLUqlbl7eDlpkGpya9B31YE6nc86mJvXzsO8g8+u\nnPzcu5qxvJmzW5+Dsc9oma4njOxqoF6RMKJImc6eEvVhqODp+gyWOpWHsQEa\nUfWE\r\n=PYun\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEB5zM/QzmhhGuMVgKMrnSStfpfJRl4rz+Evf0C7KhufAiEA6hgw3kUTmN0cASVmpK6EWSmhrItAp9at2Iste9ZKQ+o="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.0_1573485345588_0.9899221252127053"},"_hasShrinkwrap":false},"0.11.3-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.1+d2cad81"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d2cad81786202a9070d3debf3985d680c01ca391","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.3/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-rlyy2TKgVaFpUxJi+xwHru5TsQs6vl4Dnp+1D1uJv4is7zx/tkMCoV26/NF2fr99cLcMSsA8XdLcTSQLZ6/wpA==","shasum":"2ca61a030149a743cf897de2d38433d61d694fe8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.1.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXvACRA9TVsSAnZWagAAamkP/iW3ELJM4jSGORrdn5kX\n396Y66iENro2+n887p/AyQ+b7dt1zZ3EUnl7wzrGfyWaaLXO5wRVCokLxsJD\nYZFIoOGo1ZmvCvrZq26eK3goUlRm6EFqQANV7wZphV41jgyIf91aoQ3gfZIx\n7HMubGwPFoP/WGeJsQcaIdwOXM31J8EU/kMO5pVWM8lrZIY+mgIu+D0NXdlF\nyVV2iWPyRhRUgAY5kSmQITpOd5rI04KY+MM4R0SwxbzbB998ecEyVNElzKL1\nrVBhjc10I7UoExZO4HfWiBcJP5kZrzc1lXFVhouVTjB+Ea7eoPqharNlFibD\njIYe9bxyv7CaEVHEQyuJ9zLFquH5IBZ9FPsdieayoddJ5PMNLJB/ZcfgUJTe\nY3KCNUBYvAzD147Wp6BICpb5q0BnjV886gm0CXtQGs+3jRZ8Pj7YdnhGy3yM\nhVxiXxjBLcgzDUm06X/e7yVj1n/xwfndmAqkA4f3NBlytK826oQ6H8rS+JDr\nVNWiK77nqqa3QlxubNWvMBiZz6Yomi0r+44adbThj94jU3vFfI4MRYiU5cc3\n9eGOTq4TKaYKFGWCfs31S+qZPJMhxCNYVI9Sdz8LKaCDuo1Qkxx9jBeUtyCA\n2mtISrM0cMhI8L/8DuU+zwMxhXq1j3lWoWxK6tXdduBQJe86ld7CwgtH8QIJ\nHGZX\r\n=kn1s\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDzkCzqPFTMm6egb0YLYwxkmdU8Bvg9UM/U7awGVrOFgwIgWvVkYzadCMkgEZDBDN7Nhz80qcB24BPIIwzKVVObqVg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.1_1573485504100_0.9102279305460848"},"_hasShrinkwrap":false},"0.11.3-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.2+21f235a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"21f235adb0011dfc605335b8c1bc36b2c96c1ed4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cwbfR0HXx1kmA6Mv0zZSYua5WL8ZcIxzfgav0LqTsIOJ9ro4o5Ptwt818oER28h53iE7iTHSzEmnJy0uvuQILA==","shasum":"dd67817f5cf38e5da6503a45fcff4bb63bcde223","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.2.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyXyPCRA9TVsSAnZWagAAXoYP/28Y1DT0fzszVUvf3pgF\nasKkWp0w453RqzsRTzQzz78KEG3LYqRgOJCDEPqEvcUuqjXcIna4Bq5CKiiL\nBwfidBjyP/4DLhhLJmS8/3c+berG08zP4Ru2RBvP1N+xeWQRorwLUqsZPfgq\nQ4rRem0nyrmY3zN/y87udH4deJbUrc0PVs8u4d5MV2GuYLkviQwxr3Wpg3Hj\n/XYqdWa70zhLBOfhsLM/rqAwCPJbn40nwMTC+GS1bJ4RTV4zuwEF5eFXLLUQ\nYE0CR2tBO7yMCbLISog90YLbY2babwkJkY8qChTEaxyIDgkQsmhAum2/svIQ\nxoN/ItYbbsfVfP11SpbVUZafgoYeKGFGmLEMgqDSMWuvij6L44hLz9Bc3ki1\njwKM5o5vOFXf2fxJf4VYKvBFgsZlcC4TSK9k6Hm6SE2xDbmQYxDitHKurW31\nS2XjaprFBLnaxuubDmVJWqBtD1CTdYqKM0kzSY6ga11pw1FtekKLAVH9LkI/\nC3sU/ELOIJ6noAzVswfz5qQbxuubOMMCj2ATvYip+pKYWJf2zn3Yn8q1JXDG\ntsHsFVCOcnGnyJY1xE/Rv7+xEVoCeFpQfcZQutywa4d+1xbW9l/nQfLelT0o\nNJryxK/6j+qvHN2KvMzCfsx8r0DiBBD5jhvj7PsyzU/gZyQVDUjBbGIRSO1s\nED8V\r\n=NYvA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGhVngcv3r9MS+tK/MSc1iWkGEIps1rOpt5R1aQytkN4AiAD60a64Am4NhFEdGoLUi7e+tOUT8vpNeYxjjFXn/pl6A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.2_1573485710507_0.6757559617817255"},"_hasShrinkwrap":false},"0.11.3-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.3+279d098"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"279d0986267c09c3374490067553a0da4833d324","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GR1uK44jyXsWya/DbD1VzvUrKqJIW4WiALprXOFqA+jRYzYPZrgNBdjgT28LHyeZjXEptjLPCxhmFrwJAWRF9w==","shasum":"18c719d8f112cc30345d5c0aa1b28dd85132dc9a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.3.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyYjjCRA9TVsSAnZWagAAry0QAI3odXLOI8D01tT41nb4\naHFjZ/rUfTysFjRkW+morjhtjyDj2x4HpWcwYYhgle6J3dsnaAotv6PuDHe8\n1Hizan7+e62X3a6aDelzcugZqg88n2LtNfUt7fbCp+SMhVfb+24ZnoD1524Y\nYwSdkQ++9zpLQXUhDnIGMUhZmXywPUOjPMIo5dzHsy/AN/xw/kfg2ee4Wt6w\na+62NxCUlZVMTUG9KI6EAqVJdAOYCXo0sPz5pRBdkJBVrKdDnvTxcY+i61/o\nHOvYmgwl7sRtGSKIJ0g3hHX7N+M0f4oSFNvJ+1Cs6vthgb34EOZ8QWzZN83k\nMHwCbOZJhknAAI4yH48wzS/13xn1PpAjYLn0o/Rb77YVBzV8ySJJV0MEW2KJ\nod2/7S0EBMwgYQCMqv/UGc32xVVvDCOPwsCQhhLwidfAZp996g7By60s1GvT\nrf3OnD9SA4M0x+3EmeU6YQFPHf1xVQR/VipGqAkCprhPHn7Ywd71hMsIGYw+\nTrJEeKr0Fy0PeIfeOTnfNgsLmIAZ8lFBbWwCGkMVAaJ834iynzYUMGxy5OOG\nJdWnNmZJ06JnVgG/8zYAKBw4m+1MgLjPxO9da8W1jYQuH/J7hJxl5QquGuL4\npIMCCGZ+TIqrtK7knz/a3U0EoUbjJCF5CQZq+O5pGj6UtGloweSD6WBFr0V4\ne6dK\r\n=D/ND\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCyEFmdYiHg0j1LoYa5NJh/5Nejw+16sCbNbPcTz/fPNwIhAJVnaTZAexeO2u0PAA3ao1FDC1sMrkltFouMLtwxjGmt"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.3_1573488866642_0.3594422655006475"},"_hasShrinkwrap":false},"0.11.3-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.4+9f14f97"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9f14f97c3330155742d7d76a735b906da37bdad8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ksLb2KpGYBqhUUKEPDC/mnH0SCYyZ5q/m4Pw2t86hQvQ+7P3U96yevCP2YRAevq2vwHM9QJjYj/58Y4+1CoFTQ==","shasum":"369aa675bfc0720c2d1c792323bbde302edc8f61","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.4.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyYuSCRA9TVsSAnZWagAAPKoP/ihYa+eQ5XVn2iuvDF5w\nGeaW3RJWZE17ZjzINhmcEz2CIICmnxbCSxMxNqhX3ECtEiDd1dUKZ4SZlimg\nO5uISeurqOIG1nXnaIicQo9Bs5V5GuQ2NnamMfHSPSLILiaeUdUIeqBxqvhG\nIpTtMinrkdHDVcqcg/qhTpn1eWa5MwhM/ySq1LiQegwr9PwohIcmcfAewCM4\nihD78A8Rmip/qm3dfd6mA8mvhdhJxvz959NV/CJU/d6JAEsgHqQWpfysEVwm\n524x8JpDk4UiOQwn72A+wfHBlc0s9kemSTH6ClVI/6L7eD7Yh6xVjeCfLb0f\nmhwwTO4pheip05HjAuvAHE8P7/ejFp/sof4zigkqycrnWVGghyMQLppEaNL7\n6nj98bEAaEN47BoR4tuPZ/fGEDzvazyRJyjrbT1ep4HvjCcTxiZWcJ1tKIXI\nbRCf11EbfM9/LJytWxuguMVIUyUNfLjYK1hkTknl+bitKFlCHxSCdOzrurEC\n17OqzmlxxWH7SrsY0mNj+6XWU27NXZ7I1kmCcVlFocTbggyBVSu76U+ebllw\nyWMhvXFU9ceH2K4VU+5AqLVmD0hc6CBLljHXmiAsBlj6kVpJymrwQcqv9DqI\n/siIWjpIr7TZQxzbvRpVBdWNDkgRkZnt4X1Yw9OU2gGRqgIi0YD8wVJYwZrX\nu115\r\n=X1nP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDBmdbnOwIsk6Br50tFFlRZE7UteX3SjhUlxhmtAthrxgIhAKPXS+rSB6jVQXbizqUsIo9dda5jw9JbOkdUwSBq4MXs"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.4_1573489553673_0.21791052359912966"},"_hasShrinkwrap":false},"0.11.3-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.5+fb328fc"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"fb328fcd9d14d7f78c9e8bf6e610199ba02e0554","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-xblcmCTgncSDA5HOCYkQgTbTpBk6z+i6g8OqDmbZ1wNWEdwCeUc/AUIt8BAFiaMgZED5AuxTgoRMmxwGCA6OcA==","shasum":"d0a90c4b1c35aa88ad852f884daeace7f7e61828","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.5.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyeMlCRA9TVsSAnZWagAAfzwP/0DYPELILVEZt8JsMIFw\nztuFIdGcgFYK6cHWqEwSk9bRKoBKJK0Sv91+sNjSUWeN84S0NDVpxg4Seg4a\nLiGBTHbhokdZTvkzsu5Szm8+69X9TPKXfbtghpSKBERJvYPd2H01CqRBEB8i\nnbofWqLQby+f3iyBfxct1nUmgMSit6L3aaEu8fGk7n3tqTpZN39BjvtU6e9C\n99iEZ6zX6RQtkCjjTb7+jUQ/HqY96TYrc1MgNNDo4C7fHs0HqiHETExI/hxW\n48lJ2UkHsKl5B/ypbJhEC+dqf6bE7Qa76MQDkrcPXG9sWKDGMHPrP7QBuwau\n0maKjOEcfCo6Dcq6LQ1y5GUyD2JwO2UFcO2E/x/pFyb1P660KAn8cLWlAOzh\njecGJbXYltP50RtQya6D3uvc1Ib2ysTlsuDkbQEsgos1zEubA4F9hUF9wcj9\nCrHm0r2y8A0pZZJW1XXkhRMu+Noo1t1pLqz+yh0lFPRagNnAExmUGu8+MXvp\nL/SXlkpPPh6wmL6jBdH9evxIYRNZsULBmQ+HFcI3KnXBlWHobbfIMU9rOstE\nFn24P3HGwUPZM4ihfKnSRW4hgVNOg/UWJWCksRsFStBGyIfVMqQJg32Z8Gbn\nyz8liU0p4Za00bpohhMUlwpM93R/eqe/Mn6JRgo78iu6NlqufwqtlbUduxIs\nuAaZ\r\n=tcPP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCdoN6oe2yVBc9vRag8Q4sxtQxn6QIvJiupTe9VF1zBiwIgUO6Vwhc3iL38dqifnhmlNp6FQTxV5KkPXHV/DdKd2Z8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.5_1573511973341_0.6952465603571396"},"_hasShrinkwrap":false},"0.11.3-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.6+0ec1820"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0ec18208170f9c7a6f14b9a80f7529c26ea8b8b5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4xCSujHLaBjL+MQibsn8LBOpcEXogMz9ILi/cq57CIlPLtNFbuJgZjpWzgonxEdfb+5ak3dHJqvZ1iuez0jR9g==","shasum":"1e5957c82a4ea03a7cc203c4b33959a95dbb3db8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.6.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyePRCRA9TVsSAnZWagAApU0P/3nzB3l4g9hqYRznBse0\nlJrM8XK9zAOwQh45jNWzys0QyhJR559yE6qbIJlcBTL+nRyCgrTyIAg0m/aF\nCh2qF8evF9Zv7uOFPj3NERYeeGUWZz3wTxu/B98uFVVE0EwUyXTRcvLpWxW3\nsmQeXCWm4w3a1dEFba83DolKjdADeG7RrGCFQ2bWYVLrmxg5UrE5S1bOzg7O\nIfSmqljqxXuv1TQSYr8PPqmp1A6y4W8gqryshywHEXy77tA7v5sXWhaIiONm\nka2wRrKVwEUFjmG4qL+wjRMHd7PkFWOxI/AM7IiIqf5A0IwiR6WELKGDcCAL\nIzoAIpefZToKsWkP1wyG0yo/GWU+orzoPFBAG0Dtfve1sIcDxg9m0M611Xn+\n47E1G7CCbRBrt7p0TD5acIoLfmqWWJbTI26xBYf8nkTGggk/uILANk7f+rOU\nEKPGN2zNYVuFgtEE0lR3aCUWA1aKY+HyTPlLI7RDMzwGIGhK48b9CLQemts3\nPZyLebmXadIPv+4WvcvXLMCpzYB7/Qx7qLVIHVKeSuLVVLW3tZnG7OopWlL9\nf1AfLykD5h2DT4IE9aV4myF8eoMSnFfC4cPretJSkJAHsNtp/EnxwkPCIlay\nHxO5bhUo2ymh+OMxZ369/ODbucR8v3dvg/e3xKE7LvM10lERRpT6e5QoYheb\nX2qu\r\n=vOjr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICvd6QCbAFTvxvAiAMQsb2qmdYCqrzakZOJmG6eSD/TAAiEAjbxWc0JsqrnYqQsQnRoibhOPd526FfabJyelFO2XJl8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.6_1573512144663_0.6226199633088869"},"_hasShrinkwrap":false},"0.11.3-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.7+0c196c2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0c196c299b1aca3d5fda651ba5d2ffc76adf2833","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-fj/jfwimL/hyvN41Bw80vv0Rc1HPHPe20yEOVCJwZTHGFjOq6QIl2UDngpjG0u5uXQfByjDrdSMNy7lyM3ZZ2A==","shasum":"e2e062908e685e3da84c22aa6f7f6378e686a7db","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.7.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyebLCRA9TVsSAnZWagAA16UQAIy8MrLLelYsoECzWna0\nshks47iElTtMbL8KcLaQrn11eN3iVZBynj+Qc4B68XtMh1mmsMwUJhhqwz+B\nY7U54lwpmYAlne/p6/ZUBGOkRIdRqTJKl0o1OSl5H93bjDzraN9seyI4ezqx\nraqe0AwULc7izCToi+d3ERHmkJ5NXShCD75GOuHnrJX1hW9biz5x8ro/tmbW\nUCJZOdQxWfEXrqct8EUHf/s75eofzPjkdU9iAmDT64ToZZFbaN7YYegd16kT\nL75w+xUhfrHEWAAVzmUMy651wlIO1iGJNivJZJBUbH/P5jI796qH92wzb/Ou\nSPHW7HXRewuIB99uMq/6zy1Ui6CJofYRe+J2SrXNj2wzcSE/XcBPzI7C1aDA\nRB95otvGGN3MOqz9VD2GmetZtVPwmQ90hRRbE7dRZ9VFcNg4oiXozVdC85rT\nM/i26AzraZqjK8K/ypZyGYp9FOqrAzcDjDX0FTI7DVi+BsYUL5tduaI1YJXs\nWVtyTiaYStY2uPFTl9JvJTHWBwgHcQUWnYG2rTQyQzpJmoamk4obYJ3ziPae\npnV4c86odUyS13BtIbypzhiKnci+SdldUW7NcMembeKubROO0OpaTkRRkYn5\nLyqbQN3+L7s4zOeS+aZbIZC8nVXE1rWGKnM9WCbNL0GXIlUETS7UPX7cijry\nqKTn\r\n=MpcP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCpmsfqWpwDlLDzNo5QBQYfF9InfnKMPECRc3CNwK90kgIgF7zhO97YsrNfhXW/9ktX+us4K751aLxaunnOdTqCXR4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.7_1573512906803_0.6316401644533363"},"_hasShrinkwrap":false},"0.11.3-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.8+3331f3d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3331f3dc017b4b505636933a687091070511526f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-F8gHpOEkZN7IQXY5RM1fjLOZN31cn0BiM99y2F6tEfYyF3aYC+5V1BTwv65XSLlB7OTAccSGv+7aFOhzrn9MXw==","shasum":"705b4fb12f10f278949e20cd643b65bea10765e5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.8.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyeevCRA9TVsSAnZWagAAZigP/RamGvol5v6is5Z56ANL\nNEYWDTz8R4PNe34G1lPfpnr9MjGp5WtjIJXvZhPezrgmeFSpg/qp5rVGfJ1c\n1ZgbKvcBknGMPrJ7ASe3l+pAzuT6YLT4TegXDMrAj/TpD7BDm+Qno3sEX66i\nuOk6uERA0+ktWldHlT+riy8Fx79KA3OwNS4gjtSo//e5HV4LTzinpahYU+C+\nCzZz9QjttFctHJYkJvX/awsk3FQPzI7WyVKwzhBL0r4mA6FMbZTr40GUO+6J\nIA3wbnL52e4qvxqSvMydREQAhLRI+kwBqT7nbCQH+bu5qbrCrOCA4qMxEoVd\n3hoXnTAreZQ/i8A1R1PDnSohfV/Ejkn9RoRPqDZryVCHTMwd0wHXsKk6gNv1\ntHelw+DX7LFUvfERe/OsJd6HNoTDFroKAcHXmLlwqibmlppi/CduosobIqYM\nd+f8IectbrYJ51nCmziVPi2ew11oZ4Qr+wv4W78PYpdtT4BK2GR9uZvZSXMh\nt96AVFqgDw9dKdynnHauOVK/5XDMSIdFxIT23nhOmM1rIEmuCPUvj+aOI/Qa\nbV/P+fKW5apyUU07im6ILfGju0lFVIpN65bi17hYViw+/Gy+mnDMT4/kQ8zK\n9IExZBG7yCBX0WoQcyT/Xl4+xzzPwjr9sRiHG5yzjdfjcykJzamlsD0hcCry\n7c/4\r\n=OQaR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIB4QexN7sw1ECTvE8yd5NbweToYx3dfccUtFkeyJJqZVAiAh+vD9A9I8hIZZoUPnC2w3ZKNcxPr7CmKO9QZeb3hG8g=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.8_1573513135397_0.04083890348034536"},"_hasShrinkwrap":false},"0.11.3-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.9+25aa255"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"25aa25552c4c1351e808d44762a5c6e823c6c587","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-E92jx1BTR3o/VOwOTo+JC4QpnNuSucPWqspt+rLhvtl4q2LZCa39P5MfQGBvloIX6O7lM6bG3bvkOZW1uxJGlQ==","shasum":"3520f0353d5f8336641776639bc087c7a020d4ec","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.9.tgz","fileCount":8,"unpackedSize":13760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyetqCRA9TVsSAnZWagAA53wP/20TpmjCvuirPV/xtx+7\nw4cC9mFtMnWYz1UTvKjjyAuvLhyXkDZw06OxNJvxuxWv+zKCZ4rwL3/6ro0R\n2njvVdHHhPpH+L1OWOCJJA/Sfwc00siz2kcJSNOhZAmJCP+CmWmilNysUU2/\nr08H1FD59VSDTY/hf3UHRpyIrfgUnp7yko/3wexV51zvkAq5EfHI3v/naoao\nXWdctuoRgDVWIH0BkQL8aUArnOe0xQnyakEK12ohLaUpOoG+ceSrK6LpbzZB\nlUo+9yu/Fa9x1OrvBeERK4/jHV7dPScTQCiCg4RGQPvLFy6ALU5fwJMs6xCM\nYRSkNf60YU2+tGbxFk17PAjVrcau4Mnhxp110paAwi/7DI4embZJuxxvs3qO\nAnESdNgNwXmbVKAHTYEZbPBuhvwdqAAsnj41yv/989h2WjYOk9WlaIggj8UO\ndcERPApTeRTUklMXo2ze4sxx9bGJX9O3ENO6iziqFNMMl9uzMCJKjmU/eEm/\naaZ6DX8xiFm5naoEcV0BFat6nJJhLSUPyaNYG2JrKOXyl9z3d1pWYkWBVfrT\nbsVsCuMQ3Ysji0g5tQTFAZ1jPnYxu6AdhFHKYLD3rdn28exDAOzSp95RBl+W\nKh8uYAMB8sVAmV92ZBb3hbvl3jOuW6l9Pb4Ob7M5HzEfFc19DGCoI8gocEgL\nNph2\r\n=Ix7X\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCWR/bhSmp7jtRurzL4ul1peddU/bMGMz/Sirm5JQFGegIgL7/rrUGGvUI1kRtPJU3GvPrqepTp4cxihEXdYx4uBKo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.9_1573514090415_0.8807939510475613"},"_hasShrinkwrap":false},"0.11.3-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.10+54f484f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"54f484fa3982a1c9e378029eae0d6d9e7b583e84","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-AMw7OHSjZT54Msz+GWwbj9jb/AZYYW/g34l0W9F6HpcGtTkib5LEFcaJlgAK4dHnGInpgR2tGOdxPf+eFrGn+Q==","shasum":"5b54cac04502ce5f38249188e8f48d26928aaf1e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.10.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyex8CRA9TVsSAnZWagAAPL0P/1fb1/BfcqP2n3UJRtPS\nUu7LLRNh4y7/2FuZ+aDP+yKloqYtPV3D3BIZwWsoTo06M3dzS9ANPz7Atr3r\ncPaLzz4a+ex2iT0xRVn6LNe92FmP9Y0O2/m7qHPv3e7iCoDClWRg/iU+VN4k\nSqbiMcrUgkjcuLorxJZPGtgBW5hqZLR9Uef6d14UDDT1FQudXfb5ayHzX+MH\nvM7fyIdP7mJu6DtQhplwIjnEW5dFUlizA815WAPKir8VQQwT4UgyzGWiVsup\n6RTL5NrNKKktHsvEWp9Pj2j+xmveZERX6azr2I0Eu9ZetXKa8CoQLJ2fzD48\nI86LyL+CaeSCYfUKn05IglbUykzj+lTf/RQx/+u54K7EMYAIK+rCZ4kXkmz0\niEpXYw9aBiqjcweA10ziCgA4zsKbr8GRk2m5dipWJAu0SNsJwjkYrTlc0e7I\nsE2ayi84diXJmIPzqFf/H51Ss7j0KTJF9kHamjSpkEySJVHm75UeMrxBRXht\nY+9evbdXnFG5b/CZV4bkIaDd/DNNNEDxn92PacGBEBzQ31RCjPd6dO+XtWKs\nnFm9pInL/utcy+EYYRhHLU/qzQB4uATC19cmV1o3FbBq+qvs6GRv8WgHlk25\nlD9g+NeOCxzxUel+wIICy3nger7Rj3/o/zaeEr2Zjgznp1GTbGimLer+/SVY\nkQol\r\n=ki4w\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICONmkb6ppx+VZUJiFcMzQsvP3qxhd/2kX9KMbmUDSYVAiAzGYCYK5ydhS0k/5HWyDPRqojx0EzP6HrF4BqHrC/dAg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.10_1573514364085_0.6476338825319286"},"_hasShrinkwrap":false},"0.11.3-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.11+5ff6945"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5ff69457c41a076ac6df6f0c9730e1ed7d91afbf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cQNVhe2clTYq2EE79fRnp8EBQErRRENTWi36Hi/W4Kg+l367ltFncNbdchf8vwHcMnPrxCDKiZDHmBQC6J4oVw==","shasum":"c09e18d3c717a0b7cfb944e8bc9adfbc47892508","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.11.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdye0QCRA9TVsSAnZWagAAqdMP/iZQE2KiezxFfzpcfiLg\neEXvmevKML9M/9LiyS9Qt3pnmuh6inLExM7KbAM+clozfs03ev3yoGFRSRL3\n5wbbeYQbdg3RUPthszmbTqLL89SZoMIfiUAvtgATFQ+gqyBXGo+TUn1hYyK8\ndR1uwXrP7oR+jv3zTQ/6l/bIDZuw5x+i54q69RgkGToJTPzr5gRGvi3VtqdZ\nP4xPPlRhAYGDJszxT4BIVGrcSqoa6dsr0yW/xnCBW2y222ARutDOEznyJHnm\nZizL22l9umZs968cLgaZsyu3VAKfSbGeFbx5v6eQmIKWJuTZ08FECAUVWnGT\nzlQAP/f9W8/xKp0JLfHtNAnQzxrAXg4gqYiBgwsO36qi25jqu2sNtjwYh/Me\nlQPhFRX5Lopdi9kzJKbE21BSISPf+SMmQ/uko2dF/ShkLz4otirt/mifxV7x\nat8Nb0eYf8++BMw2nGMciOKgOexxgebsooIiu3zdqoYjVYA4IKXNjhc08dFJ\nUJ8sJz9tsiblWAqqEcnRemfjdcsGGgjEVcTb7GHlfK6ZmvQ3qFP+eoXe3NVS\nnGmWElzBndVHITDUfIjhAa+Ru33cjIRRz66bAFImjC/x6bzukVZLrDl+iadG\niccQssWzHHjIx7FziZyUnaTmfVNNYsfvv+2ijpnubr1GaqkyMXutdpz1g2CT\nZJjM\r\n=fpmB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDF6UCnQMAupzoGm1x3j03ZYMstV+gXUDJXoXfMRgbTlwIhAJlGaSObKYuTRPnhvkv9R2LaKF9JEmUogAI7BxHF3QM9"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.11_1573514512410_0.25193589547470885"},"_hasShrinkwrap":false},"0.11.3-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.12+a2af0d1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a2af0d1d5b443a5ee92c64ff0f869a86e11ab512","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GipX+QCQvaITLVW7We5Atq/9UAMpJrmjEX9845OTZJaD//vk7/crH7CIGC1OgtGgoqEoCSly3pgeKlVXtwCA2g==","shasum":"c229381c070e1a12e6ee9569f611b91d4b4d1973","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.12.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdye2HCRA9TVsSAnZWagAANW0P/0d2ibrni16n2sxvJbvb\niXiKH1y772P7uRJHMEaHwDetoUNHD+tpMgcuq6h3kLGsgnyfj2C3YajSnuag\ns0dW3QQtsMorO2fRIdNh+iNJnBOZePbJvFm7b6LkYZiSmqkhD+nwN9VoYMJf\n4I3z+CdntiFzHZI7ap5h/6Vk6I2RXqTb/UdoUG9lTD6Y1J0AITluF1exfJt6\nJ2ZzYsVl69qeYcgVtx+G7wNb01N2sJag5BSDXRh51ZPM/26SvdZQ1/EKysLb\nQe2v8bZa8gzT6fJ9GPcA1ZgqeU2L79qhuGh0SxDSri4EstbbIIgFgWODosWL\nDg/WnKpabRToUbaC9R2JlO0gm5IyrGhNB43JS8At4pvpogPktLalBYKmfLGj\nefthUpFeEUrgBCOAb+k3hDZcl5iKGp/7BtnDKlFDvKsfu/o4HQiHVO0diYEQ\nLd2Vqc7bxglP5uq82a+T0d9eXHNGxsKh4wcj5ZpKbQ5ZITkPZt50qqCwTgl9\n5D9AoRzW76OxxdzqhQP3j1oEoLdAMeGyemoCrC7BzAiOadqIOawL4zkhWx8F\nUOGoAYqofJkLqK1KQ9yyYoLtQlq7+5pfSm6bmJjFfaqBZx6sXUGPIuoT16Yt\nrRlCD+WLYZHn9GpGLkmC4lgFrZmZyBOZ+gg7DjIwDa9hpxYMdMc2mi6koTGl\nzAYO\r\n=z6Vc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDVzFQAl/akgsHeX9YRodUL3CL0YVNiA9MMip/CEgSPgwIgJDZuszghXZymabuEt0rL3m0256tuHxLO/bRGzOtBLEw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.12_1573514630941_0.17341913513978113"},"_hasShrinkwrap":false},"0.11.3-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.13+41be6b8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"41be6b8153cd833c7c112ae42c496d3b768ec525","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-hO5sZGoxv1+VE5KXUtl/96NznQNq8cPGBxCNYv+enY6iJY9oFvaOaO2kgliJV0XNIl7PByi9O7IH9bJmCVO3DQ==","shasum":"bf6595539b35416f7d4f7aa103c550cd23408633","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.13.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdye/TCRA9TVsSAnZWagAAH08QAIQto4fDeqXbXYXlwu/x\na9urc6D0oJl8M1j718fYfx8LgB7AanSILASZwUf6iJwLmPD81wxQokMJ4dbU\ndBKFySgtbUG/tVn+flZ+/wpOjtggk/cloF8Ipt0QXs3QrvqYOrzLRUZYIh+r\nDV0uWdl19sxIAnvEuK4vLU/2w84icKpHLf9sq9CCj9vJFRg//rJtp8sxbV9B\nHg3JnTvVREV5DCb5mjHw/jQtKNuzkF1naeM6P9rXHI5ZBE08G54Rb4Ws3OiY\nbUXMbk/4J7ngB20yerTx+/TJr2oz+rFmbMboUFRG53UNmKcJmk+xXWUSto+Q\n/vJ72Yu1gerXqf5WsyNk58czWU2b0OxyNeip+dPmTnMPJ3hUkXcn7852L7e6\nW4RWKMAgL0GhYgUVB6kIdThKD1IYGm1+LV4IH30NKmwxGPjaSoVsClT/4o22\nfuifhYNAowc1mSH40c7gC5ireoHDEEn8gu66gkNUhDES2fOvECxC1rsfvI68\npOas93YQSg3ewL9VLDkg2jQXpyrkoiVjPoHpcMe9ze1OqXulbbgpnLX0rMYL\n+569IMq1Ue9xjzCou570Ye9YOfSJkxEQjqtDMyZeHrJW6qyQ4F3y+IJ5OOJc\nh/zC/PLHYtKzMAz3ABQbyU4vhCb0HXlK0lkls3idQx98/PQw9pxyu5NmbGam\nyzqt\r\n=fW3H\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDS5Z3Uz/USxSmpf8sU3b0rS25+qTRWhiY3MqPhFN2CRQIgBaN0D3BAjGDXmJtZjeviKFXcBpikfKIslXvC60Uwz30="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.13_1573515219225_0.8359860327090614"},"_hasShrinkwrap":false},"0.11.3-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.14+58f5d19"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"58f5d197b7678c255118d1f537bf34ad865b6137","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-DrIb12cRiFtDdgI/cwlH+rkfJjj2m23u65qvWECM83ynjbPkalbojBXQAQa2gC+B+Jd8w9BBJQz27c/euXtX1w==","shasum":"7289e47e481fdb2b1b354b84f14adc376e80c48d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.14.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfAiCRA9TVsSAnZWagAAPaUP/0lOrXU/F2QoU15wQAt9\nTN56NJ8svDH0oTWNQSffy6zXCm07EpQvVH7ofeyJmoxFaHIZ9fHx7LiJgJiU\nCbsMXZjt7mqDcerymrEdTA1ZU0NA6Mme2FkK53kWsvAqXPOUrJ1bqrrW+P1V\ntJl7IAh32wfxuJO64qdMXKuKSR3ESI3G9sq9Uo+lyvSny3wAqg6JcalUnWii\nrjMFVkerCRbOWb/vHWclDNo9koKnRRgtg2emDiWFeidm7yz/hrreZIu4mhvP\nhfo5Q5ELvkwxUY7kdMUw7gDBDBdTKpjSKnAapPtf5M8VfPOVjqsWDkv6V2lD\n7/AX7bd/WnD00EABvWDHIatAcAIS6RU/ieUrXqkonuKAFnnE2rShfb7HXpSB\npbGj5CBhVtdY2u2G2BwpWfv6jheBPAuGY59ehKKaza7I4yGJHMrK0MXC9Lfo\nSIW3ke41fs3/pXr3vhnNSGRx9dS2HACg/JesUGVFY4zVx1TiKnDmY1af3YtG\ndS87GrU1E/ATxcQcBchQlYnHYW2gjSKqxtspsbOAYrKixFHge3TODgWFG6PT\nFtXnyR14ZTPrhcydsvyNAwSE6cMeiqKaOq9sfEMLtZGByDm8708Y3TE/EcuW\niCIh7lP5v86CDLQXKxZRYidx6VJT2JGoLjHBpJGzv8GrQgb/leJxnll9J79H\nnm5t\r\n=QnkY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFfJvM79Sm9L5xcd1SQMQyKCousBcSZKMFgTsgHZDSbCAiBqYlUuOrLlnovXueK8ZtfORTy2tvRl7fAtw77x4HTqNA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.14_1573515297952_0.886771151510843"},"_hasShrinkwrap":false},"0.11.3-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.15+25b63ad"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"25b63adc3d617cd4153ee7cf4d97d8e4326f9049","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ZAjAMiX70xka+zhlmyrMCQhSHmNuAgWILQGKw39IMQhPInq0bkox2Ptf/6zMRPt2IcHCRjC0aCZrGaP3nRRk4g==","shasum":"bd28f65466d04b87d60dc69323406c5832f9bb3b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.15.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfC8CRA9TVsSAnZWagAAZNEP/3VoiN19WxWPoxfwrjo8\nN8kQa/JkFfXboeGcsUlUvPKC09yFhGqH/fHbTUEkIbrz+Y6/hokBJyMamKo8\no1vr5XMIG/qavZZhUI4LKAvkqs722Q3Ads8NInsHHc56slpOlj5jdiMmkxeP\nw7X9W1tnrEGzuObxL448GC2FPvoUFkTwy5uNhbQ8eG2Cw/Or/wX9EiYy2BAg\ndI9FrjeGMRGPAnDedHUQjvXi4ytLbleNl+95/ovrvQcIrNmhUm3L4o/mp+qH\nnhPZeaVRK+Km0XsT61F7QmqkWGbloOX5XgdJFkOW2z9eLKKR7SOMomfvnXql\n0FyNyCwJjrlpgF+cRzEuZG9KZIBsA45hqFt80C9ZQFImYQroN7j/zWLRcSy+\n2KWpYEBnzHGJCcLgjl1rgp8Df9LVvVRpsljLjwrV/DT5lkp6nJ8r2Fx85IwP\nDhLWSWeoOezroioVrNn89Po9DV7y/pg4iqg+/cwrYB+rznhjQ+e+PdkwOWLM\nZID55jOVR2c8Rq4bpMffoe9NDc6fzriN2SgwF+VLIdJsNbDs/PIkjp7AiVgA\nLKy0sXgs38zkmf3Camj2YvUNo51ZdWHKVdDmkKaHYPc64MiHPOXStlGXntn6\naKsKI7x7bqCfmviIkcPolO1ZEPjF6G43M9I9bWH4r5Nf5OfaqK+2W5rOhrWL\nBEHU\r\n=zp3/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC1pWiJe+1DEUGNBcI50UOFa7ShvyFWhjwztRX+txGwnQIhAOhkg1kr+83PTgO484ILs4CwCPiHa9brU5VCxStqGuH4"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.15_1573515451661_0.5268574038567546"},"_hasShrinkwrap":false},"0.11.3-alpha.16":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.16+9311ef7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9311ef733a352e17d4493926f9d0b795aefd6da2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.16","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-eR6O3jcSrGZgkF11JK/kYKxpn6sX99WJo0I9Hht7GED2tH2po0OxqKdIauc5satl1LcN7BSjW1vK1Eb0UJlTjQ==","shasum":"f92f90c78f0db4681dfa2b23af4d25f68cd83929","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.16.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfD6CRA9TVsSAnZWagAAoVYP/2iYtQZJqGa7lz08708p\npzVyMuFrK1SmfRS05F2/9A6IS/dpPKXMtAhHZUH/1PLRVjC/4nJP2SlU9s6a\nAx0by4SvQl2QdlHE0e+9ZiL7CK0UQ5/z3cmAm2aeoCEEEV33+xpsNhPmXwdR\nI33nPInYCflKwcugRoRT/OLmqLwU2I+1dZvAngK90lDoXbJq1/BMZg7U4a9R\neK/m5a63dyIeICayNLPcayb0LuUacBOu3X/0dLQgWVU/QXSmKRcO3PAHOOH0\nUU9Z+DEkeShEe4t0Tf3HLC57Ca9kMOdRjnJ+8ZKozqscrD/7hzSAjYvfPp1X\ngCjbeSFRD/vm09w/E9WpZVKfEE7gL4hXfuDw7syawEpgJvb2MEQkmNacPwp9\nUyN3S/jSdjcbLyKzKLv55UXGqRKs0FpO0dz0epc39n2TXu/tOkEW2KZfE7sb\nhyQBKAIyyIeyechH7UbR7aVwYRT+/HW8JSDKGeZ0I200PIUs9BezyYyv9nJz\nK9YejK6r5LSGk1qsnevE9CHWEXxnZcFlPZnBRLtjNVLtptg8eZXnri55KyhW\nW+r4fVQPPv+vRh7/DOKkSomzoUHTo+fm81Jptt547FhDXwnbiccKg4gWWyqF\ndtYI7mwXiyo07Z79v01+so3rp6SvEF9985CRe1Ha0KOE2oXDnpKJHczcEoM1\nnQ4N\r\n=/O4I\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEquas0kgnAChUh0pFGdjZGtwd8gWVtlnp/3FWCVD5deAiEA/3lzN7Eoxi6JLxdgAuVVaiJdbXPxpaOTv6WgR+UAHKw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.16_1573515513633_0.7144137196845599"},"_hasShrinkwrap":false},"0.11.3-alpha.17":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.17+d68de60"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d68de6022d69ed5f3beb0b60eeb9b1c941009f2e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.17","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-wUF//oRsc3BbJAjMhaX0ugwab/+cCVv7hJk/KB1DEDbHDPEGYtPozeBKGCbmJplwWHZ3KOX6aNDTvOKsYJnRxA==","shasum":"85564ca13178c6f895fa0b85eb6e2535fa511706","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.17.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfH4CRA9TVsSAnZWagAAAsAP/ilPaJGzMscCApc7EtZb\nndpBLcVSKtXniQEXu3BSi3BqdCT4VG7ZF646/DXwnRjmVd9oRq+x5QM3CFUs\n35RGH36uM8foTAiLUCZaz5bJRyE/w7dWZ7G3bcQLT9xInBplyptD18rza9sq\nxprPlWOMRXhFq7+8GjOnSJ+zo64ds2KosapXiFbAPDQHsRnhnpEp0SqGGnWy\n6hwDDmK+ydrw0G41HtCOnrh7hGUKoXxm11M046RGOp22EiXi/OZhoiUjDxTb\nyucbuD+MV0wUZ+LrZxFuwOR8d8OCenW2LWh3YL5zRbMvXheZ2/sl6rp21pHQ\n1e0pQnUbHgGsWfMDkmeBkQhOSGogRM+GlywLNHlQpQHeUR6HxlxvpKmxniv7\nplazAviiZXS8gDdsoiRfQW4QNdIXwSBBMSK8ecDVaBMm5XBjPfFjOjzc/BYk\nMxsjB/OCIWXbMkFEEE65SB5Q9TNieR5vH3sxI+In7FnjgqGs5u9XRoQnL/Mu\nAj/uxrGyd0mvshMkmNzNpmiToeWPPz5vbvcxk/c33k292RQ2PEr7Pk/M9//K\nEqVPlxU3h6G1JbXsbMmdYZx9Fps3m0E1reRfVKbO+Dh+u8P50uxcwYq1pF/D\nOZCz6h12Qx4b+y9UN6Cq+HYqOyVFF6L16+DWSv9j3z5nolBaD6qS25+C9JV3\n5t88\r\n=M/ho\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHOI2vnmZc48bv/qIycWmXs6nx6Aelsu5WnH4CTvCrH1AiA4ow7EdM0zxsiz8a2OB9OFzH2KWWyjWFoZal5Wz7nJiA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.17_1573515765462_0.36562076695475976"},"_hasShrinkwrap":false},"0.11.3-alpha.18":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.18+3b82301"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3b82301f91b4bdddb42054d6f50e05f7be07aacf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.18","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-kdIB93ITA8gYkoAglLkihBaP9jiMy8cuUfDOvqZORBOBLotdCnVZ2RY2fM7jC4RjtDPa7tybL+tLJcDZBh4COQ==","shasum":"72cc6843409ce027992d23904ce0c7389f43c9f7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.18.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfJXCRA9TVsSAnZWagAAZWUP/2dClt4hfBpWv+Evm4ZP\n5BtAnrfVHX/eC0RJutM7JcBpiQ5UGvU7Ehtef4RoPNo2VUaMMzJZgevy0Ss5\nXMuBAukWeWgdpklhaRu3OY1WyhDY8ygTDjx9LfDC4iMhTHbH07fUNByG5Mad\nsbvHjtRVcRGK5F5Uzvb0uXs9wL/BRSAaGjdYoFRtNr0hu5DySTv+RFHP05gK\nvRW4+rDkFeahGnIMs1yStojSKi7HuBVs6WvTsX4obLZwnE5QvaKSfsEa4CFx\nDD/SVR2LfOXziBj7dE693VjzQoJ/6Yq/rwlKv8S+7bk0tX2ggVVxxJFkRBLB\nqgkFWvR9BNwsJxaj0fYFkdkHAG/p9LbMmxpf9iaVKuPzmVUueKogWdWDyWhZ\n2otdPXE/UYyG8kVZKnoVuyxfKB2Ldvt2z46oW2WuOAZJBkD6yD86mKOcGTM8\npO+JvXzbSiZhJeX4TAi0F63ofAHq3nkp5XKzpVyNt98tIrzOIjfXmrNNmVbw\nROGgqucgBS2E+eMhROLe9hZbwD+6W+JZ5sWYdK3Paf4oyEQKBdorydZ7VF0V\n9qjVZpTtiKgTWKmttbqur0kJHBQajBZWPFOKNOPTonD4uk+9RLJ+JNBbh0wC\n3pVFMrZV01jVkDKFXX7mcK+9uXYXMgyiS4uleFmN+LN2nNeaRdKz6sehXP4/\nbspF\r\n=xFKV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCkzsnm2bjnvu7cfB4AObPl0oW273damIJntRxvImZs0QIhAIRm3EF+3SbS22Wep2uuNgP6gUaYDun2xDC8AZv29SoS"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.18_1573515862791_0.07093960589043813"},"_hasShrinkwrap":false},"0.11.3-alpha.19":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.19+c3cc398"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c3cc3985d8c8b3f9142ee36d262e3d6416592528","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.19","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Z5SQ000PwS3L+Yn8LNuHA2d4IcnUg4v1JMA7FUNd7G8Wel9joyt8zHcRIB4iCoX/oyuwTEXDj9FKYdrazhMaSA==","shasum":"8f6e0ee3e2fc96a6d7a066f05fd1f4fc9b43df3d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.19.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfLHCRA9TVsSAnZWagAAXj0QAJk5epi6wV/lIW4w4PMb\n+eGFnFqNfl9beB1mIUxo96DCHwoGbcQ5imIsuO3ptEs1kOxJ9tevhBADhmGs\ncooQX6izApJq41zWcA55LGGSuTvKjGvK4auVd90qfmWLQVDJpO4incC3cTCw\n+//gkDAyPrXxUPRVhFm8tFzSYOeW0M5Kc3JA61z1v8xZlq/D2QJ+nPaB+2bn\n5i7zyXOYcrFTByRGJiO2wzZ8KNKaxXt5oJcA/LAz9b+AySGCOWfL430MmOob\n2/uio3peQXOko+Rh7mb8jf/l5QcTRux/ave40vclgA14xUoe4/l1W10gJbce\n7RMwnSWovZH3pGRQ9n+7GjetPwBrZgHfTjEC02pBNWSDnOYtdg6pb0K1WqUd\n5ws/LRcmgkUYp5Gw4TMJ0csf7S2yUKgPWOyxFpETJ5eJ6/u4dhwhKSgZplk5\nlw8niYqm/P1FjODQhsqJf++aTMyc6aJUpkqwEiLrPcO8yxrB8pE3SDRa6w/N\nyLP46kNGy30/Yr9Ie8RxadSu+5ZaErbP7RMcUqpLZiXSDSLk2FqU0WeWZZfQ\nElPC5nppY6juxk5j3uC8ANeZTyTAdGVZ1dQar43dMa/MpeEexwVqq58YHWzC\nPFUaJVKZF+R8dsHuFjBHIjiDBMo/wqDSSgsT5pGGsBcCi32YjH4HtNPliHmR\n/7Rb\r\n=3aHB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCuXXljFMBm243J0Dm+CnT+CHRa7d+DM+s5tYm+YOyT6AIgNDmaZH3Nu9VXu1zUdCbKjuW3Pjn7IsD37CiQaRV4EoM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.19_1573515975159_0.7469256230241919"},"_hasShrinkwrap":false},"0.11.3-alpha.20":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.20+1cbf360"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1cbf360882ed9e88a36e7118216e28ca64eb41a0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.20","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-l7cKBeH+A7zMPVoYy5238k76BfFFnxLe0xcr4vsSAA6hzz1dZR6ApmRZIYD/Z85i0mOalzoYW9SNWnkWAw7xrg==","shasum":"3632f4835264b220a7a8ac9ba1da4a44760429ea","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.20.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfMQCRA9TVsSAnZWagAALxkP/jeM1pU57gNoZ4nd8gVa\nDgRgh8k7WJaYnCfDAs2O2Pw8BBgKRvkXcMchC+TYbF8uFfd0drYEMOXgsWH2\nZ2lcn583rqE7KJr0f4nW+IceZqpTdQTvDoma6rYyjva7MJLR31/VWbUhd3qT\n8SEO2YJWQwvaNtdbhGm+5THMMhvmwY9Cc8D6LojRs+MQJflUfBBSpzgyY9UW\n41DMUdeJzDBcUpldueWlnd+q3JV12edN6Bjw3sJ5QGy2jn9saihFJCRlUYdM\nfMK/Qx6wMDGqHwvwVx3+4zA+oRW3m0wUfzLyZENAOcslrk/UDiEOK2kvj3sb\ncxQOyLoL0HZUpcE+0YMdZBFUE1LWgpngaBHPBf8ddKCKumgt8HSnq97UTiFL\nK/ctAnBC54o0/PhxViEav1EvxEy7rtwgc8/EszpzXUfL1Ml0Vl3SPkKQo7KH\nbEsLvut/0V6Gyc7xWZuu0ipZu6udQ8c0qoeXvJmZ86GbgUmmUGsTdCpZgr78\nA8LBcjALrH3JoaVFhgFzdSudUglsVvQmrEDUi8CxjEUH1z/P88II1ZiQrqFY\nKy0zUbTorw21juWwsLSVnrfMSxNMx0VRSJSwszIBFYYqiQZkfisisA8XVH+Y\nnaEloQectKVua5W7DBoSvRj4TxsJ5O5jWtNf8FyNotLFXdJ5T7WOoGcHO6dB\nxcYY\r\n=gF3c\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEdGnjqCG1xj/GAreb2ZY27BOwyvvKuva1Jhru1sl8DhAiB1HRUNb5GvyS0uJiYsk9BVl9nfYlP4Zhgx/HaTiExuyg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.20_1573516048226_0.14861506772096855"},"_hasShrinkwrap":false},"0.11.3-alpha.21":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.21+f02fb2f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f02fb2f2e9a761ccf0302206d3fb3231db1c0316","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.21","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-7Jd9TU26Emt6fJrfXqVtFxfimK52iZBvX6hS4rItiM+P4v9Xgu5ZGhbv+mHjKJAiwFm8C8NXEa8BrM12RDtP5A==","shasum":"ada35e5e318f47f9d246a4fa34f51fad53a14a3d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.21.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfN2CRA9TVsSAnZWagAAjnsP+gMt5zzKxowk5XVW4eCW\nsJG9KyCS3F6HxniWvR7m1mlUwGAWKWm9qJRbfRwSDO70SHdv/6Y5PckOxyf8\n4dNyApVQDxBYMm3nQrKeedwgJ2fX+Yf++s4iqYqGwGUxZh7c0OI/kTDDzRlN\nGJNzmw0rz1+w+2iiKCR+m97rP7ZqSDipUO4MToTiS4WAXrlqeI8y2HTFriv6\nE2elHFLyHleXovCQJKXhiT/acwV2gmYLPS4vWSaSdn3mccqANIE6Zj7VEhFD\nQ2gMbuhDSPmluFo/05Alfo/F4rHYMuxlAzY1u+r8VmF/jSU14KEMisjl9LLM\nAlSIYnn6oqYdE1wmn3t7CIseI8jwIJzltMwfI9Jkrh3J+fQgOlN/b8kPI4lB\nIDAVKQD+W26qKcz3H1wbNASV72Tq1lhRiGWMIjuP+BS0697ZYPPuLEp+NGWE\nFiK0LmtAiEXmgQ6+iVB5T3IA3TJjVm2ijB2XYsT5s5/l/MZxiqTfyRLJBmKb\n+IRW1Ze75IfNJff64y88jFXrIJo4ELymn6kzat2P+TFirhHmnabd0RFG8vkO\nd5gBIHmKyZtH9OOjybo7FanWcC+DUpZBhy/gDgD9Vss2lrgzipTJGWri83Ty\ndkAomTl1oyo9XPjDA2uLo1WZ3y6/EmHO4V54uDubgIVuEZ0u197i2VrwUdHC\nUQnb\r\n=F9lI\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIExbt8kjOeh6Gyn40X2GD+D26P80B/jdboyi/T+VOnH0AiEAu/43shZeZ7WUfIZc/cNHyw+OppNxyByzN8CUmDxmPNw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.21_1573516150342_0.011536687509532406"},"_hasShrinkwrap":false},"0.11.3-alpha.22":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.22+bc7bdcf"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"bc7bdcf3e2f239db26a8a9492a66e6563ed6fcb8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.22","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-QGXxX9cm94bB2Sb2Iu1nZ2ErlShODpS5J0vA4n5VtmxbY4F4MZiC/IHNDlUnFZyDR4vAIdXOAw5hhMPK7Mg0BQ==","shasum":"946d8f296a262c627bce0f4e480ec6db62892b70","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.22.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfPOCRA9TVsSAnZWagAAR5MQAINs9fP9zuQGea1GZgvN\nTf7MGx1AX+72Ngv3RD/BWguwDwDX7e7JFSKGSd7cFjsNyk8VKZz0Gerhert0\nEP4AKaeWZjw0bAfgHUw6pHqkvq0xCIKbmGCBEfIy5/MVIk08JYwHwvqRs3cg\nv4paakYrPk46h/5HzBYheT4Qt85Gz/U6fO5LPsGSeaJww1ajFLVW6XPVLBre\ntzHvb2XEha7hshijWZUcAVPrrsTU5uHUn5begd8WwegNI2PWLUJtRE4u4ZGI\nKL6lcb+KJLtHlXUH2wVLEsXPHk7l8A2mbepSYjy0j8wEwRc+ob29qsL+Wvpi\ny+a+wNHSDJ0rJ9K+pyfVPQDSop4uMKvFxbc36t7G8uCUx7xkMKJqhAgGAcOQ\nh/eJ6AVaMjAIgkXoAN2LiqLBScc7kgza6HqqF4JP9+yF+xeeBRFVVf/DsMgw\na5j8XBXzi4nHI/Br37Qvrm448sa6SAt5pF0PgrjWOJnFyC/GiXW6IIE7GEeV\nZ85YsiM7u7b+4pYIylwKIboGo6wf1yOOgz9+8xYGrLGwJAJQ+IyIn5B/2jb7\nW6wjMBFSLvoA95DzQMhr4F0CCtClXx8OntyfzafLWR8mbs9LmuqCzrsZdgI6\nHz2gIG+uEfPwJIUwuBIEiF/QRSvbWeXHlvvIjqs/iUt9/JBQezBRTTuoXO1M\nZ/Ck\r\n=Yze/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCG+DdIsOVxh6yVG3UcpnnpuWoeHeHJ8wg0pMfx97AkoAIgb1dut2fumtgMpb6S5MnNFcUWe4+Qzo98vN0wcKSZ3F8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.22_1573516237844_0.15111081661181935"},"_hasShrinkwrap":false},"0.11.3-alpha.23":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.23","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.23+e8c0c1e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e8c0c1eebbd20ae615bdd63d5c4d9ca10634439e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.23","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mJkMHJkp/nR7N7NzqLRFsgihjuIrc0dpkXN2OPJ4C9q8nzWsqogFdObGAcIms3lhpR1kuZhwwNKYio+W+AsRSw==","shasum":"1baa16b87d16e135457344d0921b5a0a6513f161","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.23.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfRSCRA9TVsSAnZWagAA+s8P/3xhdIz4QkOPtsY5fBYn\nBLY2Ja/Js288id+qb4rlIGvOZ0bj722HnnRLnVVG0YbeM8nhXSAvoc64uN6u\nEPWypWkKsZjCtVvqFRO4nWgTKbd3S+6qefc60tGfTt185aMwBWW8Eq1GMhQf\nxy9a4CTQr+77UVNDtJg3PRi7+xI0CBMJ4u5cXwOuAe+P6D4QUvOz8A72ZrNf\nQ1otLJzGC++8KklyDa9RXbuAmGBOQV2uGkrQ98Iv2RACsdIg1nUWAyAPVRMo\n57UnGraPZA5KxNx8d3liMlVnogeQQtMfFfsZ5jC+ejko/KEm2gkYOR7nWC2N\nO0czceD0PEZcm97KctuZLeBTLndbGvyLlcrzpdGuXNVrlZw4XDMgxslp8kux\nznggxOWqYyeqrDnv8LhByg4e1Kw0OeZn0O6+oMJp4A91e5m967I11K0MywwX\npPqykb3BQ2IsDF1nE+qRb78DpRiARL2iLQIPCvk0nfnVRSnPREqE7220FX7j\n++fMnuVHV2kn5hr522uiqDPN/9pu5hcGhNviBKcSEjUcR0RF5AT9J7Hei+Ay\njAz4i81U4Gg4c7iv0jOyRA1dGdw5reRiaoIIqs6KgXiUZW+kEOjO/OVFCje2\noBSaTueI1QjtnZU3bHncvnmgO3YjLsQHvrj0tnpdr5D4cSLwOADb68/jDZ18\nVv3n\r\n=BKqO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAatyjEH7Xs3kNkJrl18sRGI/GlNP/JeV6jsXy/iKAlFAiAHri3lRNHRTGKoEiY1fVc7d68nu6LWlIx8wBFhgLRBzQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.23_1573516369749_0.5816436356602839"},"_hasShrinkwrap":false},"0.11.3-alpha.24":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.24","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.24+ef483f3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ef483f3bcc3318defc2253dc2a7c7ea65f264b76","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.24","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2eBQa3KUnE5clfztOG3MhoJrFYsG7A+NtM5acLJD/mAExUJ+v4jn0FZY1l1aIjuXEfzqWs3ahyZBr5dfJN82tA==","shasum":"441042a19e4188214281f97db044a8ab56848a28","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.24.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfT9CRA9TVsSAnZWagAAV7kP/04FR2MJo0NK42EeIejd\nmzp8XC2S2jiEOccjvo7Qj+dnUZH9jVWLuI3x7v/gZjJMdJCpgeMzbeCkTqzP\nW0HrlZhEmDILrR6XqvXSSNVjOK6pxOWA9fMKLTRguRpEH2d/XINqC6HExaFq\nPoDQB7rovm5v3oMfEdV1wV/Tj1amgLrT5O2za9FGSXoJZqfl/K0g8OCq2OeF\nyGhBAU++FfMFKV2ckmuZrlQedLb8fH2xu3FRojZAQPgGSQwDWzvdR/mTZeqn\nkciPXzbImoJyUIQEGjmZmOrItq5oTivWojVZxZlOSDxYk/Nkk4mn1PqnHAib\nVLO+GwCv0tr18+NM0X6xL9VV0FWKzixP4gLfY6+VBIeov5uE28xtNuP4Xjcv\n07HCi7hAaZ7M7xYr6MPkywg7MvMDCNc2BeCgpTVU3++/Miep8A3sG9z7iVeH\nozJ0OMhqvXyAeLLjkNGaxdH4pCaxcpFRr9RIbn6HUAXyKLXyjkFZA8uQHLb3\nZ8YKwEIzzfRelohNNSTFbI+BzgfpWMDyPW77QaJ8LIv1j+4yUm6SnjP2xKX7\nlwgADBN1/QVigsh2wI61SJugv+/CswF5HDKZ3+INBoAflsdE/d6NIexeraOl\nLZ6WbKhO/ckjuEzmLkmENhu8vGHou8qGX9q+DpKDgF5hXaJSRkZG66NDuZw0\ndBqP\r\n=Ma8X\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDxgPG+HmyIXrx7pI8dC311K9ErJxCF7kCU5ENpYkfkrAiEAkkTLoTpRsG6Ky903BEavjEzRphr2Q7btE9c2o95xLLE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.24_1573516541350_0.174910481340401"},"_hasShrinkwrap":false},"0.11.3-alpha.25":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.25","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.25+e7670a1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e7670a18e846ab862ff5b5c9ba119e631218f47a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.25","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-gi8HHoFrOkQ4tbUtBC1LEcs4y+Dwu1hhhrZP9Sobc/weGOz0u6lTpv7qiJYXoJjxuhihNC53h6I0HA+Xt/ojJQ==","shasum":"d299030d73b11fe8c6f68ae13f3203cc0cccd3d8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.25.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfWnCRA9TVsSAnZWagAAiooP/RO1Sdn2kf1Kgn4mv5fD\nKVKLpOSwYuFSYdtBFcVOe5n75KgHSciRQFqB6R8KymQUzf7pZg7zs9/ze8up\n5+oSlecRMm57OkpmxzLgy2ayNTShK1XM3RdUu1FRKXQiTfEz3efYK+738fIC\ncgmfs8v143N6hkU6xM26SCdMPBZaQXXJnvWdeWzRFzGZfTJYAtrbT9VpeTUI\nRubOoxqWM1Npj8XdEgFduwU6XElalVatM1ZcqnXiuK3sFG8Sg6/cXPf7gylK\nFkSqZKGQm3ePbX4SVNwq/HXeWlmH91lZphECJJE85NScOyTChBg7aeLmu55K\nr2F40+Zx/ijZr1yvyiPc/p6aMHdOhr7t8o4CXLkAx3RLdT/jBHOXBQfy5axz\nBWyvLKybeZiE45DEVI0AIMduKfxX7lqjy0tkBtpUzzBF3JtbYBodv1C9BD9E\nUZexjsoWYFJOZiR/7k4Mt2ixryjRMDeeUZN/MPova2+jL5f+aY7JLlKpOusL\nFoWsRTIsP4ZqpU+L1iif3rzreKoXGaKZN5beF+Q2X/j3WjY4VND8Y5tDOMz/\nd7vzAwWDs2+jkYwDktxZF6HmuCR07RjCXQPGwCfgKOcgfkRVYouv1+RYPmit\nQ1pvZSQLCT3PaynbTPzowIoMqgNRjKou5GjCmLT7n2VYj2cIdepYT0zO6HWK\nT1vZ\r\n=0vVr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCOOaJlZfeWFSCWiG/cZ3NrkG+3heN6YCplYi49m2+ZpQIhALdaBemtCnWF0d/gfzjTvJbXcgT4FjvqIV+5PN0uVgUg"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.25_1573516711415_0.30823908736815797"},"_hasShrinkwrap":false},"0.11.3-alpha.26":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.26","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.26+cb325e8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cb325e8589e9324da5ec10905caed11aa155edf7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.26","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1OoDLK3rfZ5VCRe71RybbBsjX7mJgbIH9wvpOT1aZOS3w5T2/KEbE1GWtoM08vRnxVOa7oDZAc4tyDmZPCZ8Lw==","shasum":"0d77ba3f8f34025cc3b555a545f012c1d0088af6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.26.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfjECRA9TVsSAnZWagAA8foP/j7x0CHIz0MZj4YSg7ZN\nHg99qyLA+ZlX7/+XSb2fHgCZ8PCRUqS/I3S+tCUwvsbj3KzsTzyll5fCxYZ8\nDvLQoIIadaZDI7FcGrglpfN2yxVTPQ8/lpoqkBD6Kq7F5E6ivbOED44wmdOP\nAxbepbztLRktWpNMU2hQ5WRDLqri/B6cYKa/hp97feMysFHPVNaJ7tHRRbS3\nfG/RcXe/iUpAqWCWedrlOIBh6eKO2ZmD6kNrQf0SUukuPrvLhq8++qLegr+1\nztJhCqkNY46QKis6+skfyr3C8PKQ1zzyL1G/zb9ZJhLayc2OXno9ZfPOfFd+\nUuzw4+vvknND5/kruNcMBqHh03OZeL9Q9tPuHLM4i3lPEGzf1smT/Eu5NOd/\nOHTBiMvnAujmYyS6tCWHcsJR8Uo6NhpRO1r0VdcQzoGa4TlGal3ZNtzNFfPJ\n7wU6fGVUA6LEWRX7LmJzoPQeXZuqpeCaLPYrYOJ189ERrvNorPdeZgHwrOzj\ny9L2amY8fIxwqr+A30m0a2/4Ak0xg7riXqK2VwfD24W0OWrtXOclWP3oatup\noc34c2uJ4cPLgEQDjE6Ppu2IuVlFyV9YDMDxOQqUm1WDXf5/SCYxyOogqJcG\nrg/WA4vwbmpLTvJcATq/hoSARHR1+8YBNSrB4zOsiPL1pO+cQWLE6yUWi6Wq\np2hd\r\n=pMwT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD9q/KdLR5NXBsrS0aT/Jj/lrrs1j+orio0BsHJ+g8G3wIgehetx3wlM49+W/5gZcDyj5mdqbLU1afRWsielNdCWhE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.26_1573517508236_0.04589148965989254"},"_hasShrinkwrap":false},"0.11.3-alpha.27":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.27","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.27+88a8bb5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"88a8bb544a6be02bc3ec6a091aec6cbdbc1b418f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.27","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-RMqNo7f+A4LHl3Hb0tfjTq0k7NnIcq1ma+8O8kH0ud+/iqKxVRQXo0x4xSl0tLjjIdwavdyHwKEeNHlGUi6tBA==","shasum":"20beb8ddf7deb2a9ed297214fffb2d8fa3f65b42","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.27.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfkzCRA9TVsSAnZWagAA5O0QAKDbbzbN7YiFPgbHsB7d\nIIrxZSOAMEBIeb28F+waSDL9lyprm/1FHi2G4Cq75uslitKNsjraphX3XE1F\n4+nQTOvfJcaSGH9/vLtpnhogaqLFfbhednPsIxh0H7aID5n7wdTniwEak2lQ\nmZHqcgCxX0txlqFvrRSixccCvl/TUmUvBahCvnGHz1MmuIsaJL0BRZZz7b3R\nxsCxfPFSYAQuHMPFIlKRdMFep7el0EBJMuoDLV2wmIwLV/Cs6QIsCjoGOQ3v\npU8MYuFpPoIF++Rg1P5zjy5XMJ+/nd1SfcywZFhn/NA4CeiqeGu49ucFQD/L\nHK0BN8jok9ro4H5tQw8UMqdVZwe8bO8W8q9zCshlbH9tmAsgrv5GeWnms8p4\nSebv65vHQblVMPCWCJ1W8oIHmGCxLHmmEVdt0abutgzyxtQXlK1eYFwh6M7m\nWS7jkU5hovs6UGjsI0TaqKDsKXVvpgqmu1mtkhhYCBQEzn2RBK1JOPLnP3dN\ni3eMEZvmU8FeOs2AshuUSAIo2PtekRHplnwabVTzGiASPbq9Ec/cG32w1xVv\naEU92MNj1jeDG4JiapFJ9TK92DBWE9WPkaoeCkxPpd1iLafbTCQ8K0AuJ9s6\n+NPzgSv59qPmXDXbTEphQO+cz4VjFdwb1PON7mKzIRRxFgxi4+Vml4jHbHNM\n7ISo\r\n=9fPg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDaPR/tv6f9jHwtc+u+Jtaxv7GBKj36aJLR18iEN+vZfQIgTXpG+G6l1S7dsX49C4NsK+JXcljPZ5pf5h4KPWWtTDA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.27_1573517619129_0.28198441324541457"},"_hasShrinkwrap":false},"0.11.3-alpha.28":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.28","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.28+922f76b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"922f76b26e1e2b13bf70d0ed8b99490815712418","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.28","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-59HTTHG5DswvnbxGu7vsoP+xGEAv8TtGDCwjXqWPrN+jU5me+y8f6FiOahIC3wlWwuSRiC2qvFU0eohsgOuIHw==","shasum":"b164e7e2e7de0049b6af0c37bc25dc523cd00e1f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.28.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfmuCRA9TVsSAnZWagAAbH0P/RZ5PnlDhK0cYHXmAUDq\nBXwTIlogwaL88+0aD/Kz4jgeEAzKe1nV7qJUP3kqoG/G/oc1PXe2eVgKs/Rg\nhH3/8VAbf3CFC0YW37cMgoYGwAmZorvxiEZIjHzBby45zafzDDZJXrx3XHFe\n+7AqlUBXoxF9TwxERq+x8x8VM3Ix+x8kEPf3J9RUJRe4AoOAvKhVd3Fb7g03\nDqFBYkFuvkg3N5kr4tT1NSkkbZxFiYCH8tnvKZ9Nve5mciDkcMX0eqI0iKmY\nsVvvj58hfkb2+x50rrRqbvgj0NIsy7H4y465pnNtTmYlfwOLaDC8+Fg5G4HZ\n8e1ZTGHWm/GiMETwM3AfnFp1e6KBHMdoI/hndrCN65INqgHTXeGLF2tfONJP\nTUQnXM+vSRIsBJN3V9jfavqoeb9n1YOi3DLlS7jcQGapLrnOxHWyrbuUaRhk\nrUeXrHYo33CRYBQ6fNB80Cq6WkuJrSJsdA3L4XtB3QGzlJkUBIq7rAfXED+R\nDeUGYumWzTPQgdrFI+LVKQCphIt30WNnWI2hh/r6bQ+4kz6Q0vx8RCKanmta\nQXm4izwRm7n4w8JFpOwq/A6c7D/w1Lxe/i/of6vhDw3ILda/yLNkwhr8ogam\nFgnX5SD/HheqR/SvCGxwYTGvFxa0lCwc/ls5SHfA2pSHOAq+zNXQcddEn5NO\n/wuO\r\n=RPsQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDE/It481uKRTsAieTvjYJbefwFKAVZL4LB7rhyK+DwhQIhAL2sSqs5jprCl3/RNj0O53G+j6RUSvy6Ga4LqctkqRdq"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.28_1573517741914_0.960052619117995"},"_hasShrinkwrap":false},"0.11.3-alpha.29":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.29","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.29+34a8c6c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"34a8c6c484915aee6bbb0e72669eee4a10bf1109","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.29","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Q/TW3DorqHw92GygZivCG3N5S49FuqhrzkbkBjnGuGth1OnWUEKQGUBbS9GB4M3RiY1UyaqVpy+WiLHbbL+tGA==","shasum":"2e1cabf482de67acb885a469c6840e400b91e1cd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.29.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfpOCRA9TVsSAnZWagAAZZ4P/14K8ivy1LEXFhlUpM2O\nethyASla/SQmL6Td1shP8+CbkLhwTIhnRMb74Wmykjl3RjY59qjKrfDfrUL9\ndgxqM7Rjyzy1QH5q92UH9tL5/mdNfRdJaxSNaUKMjq8WFHo9REoZMaGW5KPZ\nTHcjkAAqjXisM0DSsA66ZIqIdHZbMYmwmjp7lyBbBQLeQ0DR71wgxNCLdFQV\nZgrLizN7vzTP5yAr2RToTNmpdEzw87KxE5XcMHUOgn0vx2sW6eDMXEWWkizA\n4qfMeYgM51KPTgAQ+C/X8V8ShQgGp3/OktZNItF5IYoj2KWnLWPsZGHS/1Te\ngBMhV8xAR4dD8niFpOO7AXwVuIn/pOU3TZu5jhmduhuxkoXlJMi+VhDZX3+f\nHfP9hk7yTWVPF5StLIn/ovGaU9NLXyid2tqyLRAvqn8UHyCLhbAsWLWi0ZEp\nKtdUR7D8lVCTYcPlAAJj0V0jegmeLExZtojwZ4sal1opx2vPhyqhcl9OPfw5\nHf+GfQ3Z8+uQdvIdXopViqk0ukWVJSOpGH+sVjxbFt8A+J7yCBPzA+jvyrE/\nznSZzFWdI501uwZEWcUjQFd0QZzBFU9rPcTgaofMCp4yAH2UtFgMkcI3GQNj\nFQ9eAiPk3fpb6k1EtNcnDDqEHp+xjM4Vm6+6wjOc4gzSGtPQOVMrZFHp+spk\nm7vv\r\n=Jc6g\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIArk31g4LOTfdlGswN6tPxKfSA4ZBjWJ1LBsha89QyHFAiEAkrXq+aWMtHwkh3Pjq3vYljg7ZdMMNfMk5rPcpRM/ZpQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.29_1573517902436_0.20753432515360148"},"_hasShrinkwrap":false},"0.11.3-alpha.30":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.30","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.30+e98fbdf"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e98fbdf80d1c3564a99731901f0128896d17f633","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.30","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-xHYrwCh91P+fmqoYfa4/Gx2Rx15++vTHNetvcVT/DOb6kmKi/BWZblJ+CER5SpiwC0UsM29frpFc5dcx0h4Gbw==","shasum":"97ace0ecd6352114b01ad056772021b21aec89e4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.30.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfq3CRA9TVsSAnZWagAANWoP+wR7k5nyGwXkQLPdWlFX\n2kvX0T5aB5BYA4gimsr/4JpR2qjf5ipsghW7+Up1DCI3tJdjjkrb77PD5xrh\nDHod8uRZix8yuWFg/X6PMUO+jN+9jYeNGud06Z71hszy+QEh+wLT0b8g0nIr\nyr5lXmDZk+iDv7o0cj8jV1it2duOv1gIyUc0hW6qCdyyJbfWjXc0S59kWWgO\nFOdbNpvc4RGX+uaI7dBWbKFlC1fBXLjZYNzAJ13IOjmwEgOglmM6hPodMOsv\nyLBnUlSonQ9YuDQcNmNP/3cCQtWityyH0/lW+Nnh7RDDo9R6DhOXQY7vX1zu\nr9EhnyUGoPjDDuOLH9hgRbCHowc1e6mu6PWPoxcTKFUrCBXMqzMS9ttpeDxq\n1liZONElPEvCpDpS7E6WDBdZEFtruEZBKgobTe2GxEtbxb06nsq7Rgpuq+dz\n3BCaFGppEOqbLWk5JatF4e7Vc6W3MMWKNlSk27OjY+dpfDn60ruIm2SAIikh\nGbBkwEDN9/G4KAOTZQmVcCfLNJdl6zmq8Cu4nJGKwocn7prEljAN01S3gN/5\nx4G3mg4M1dRySOlTqWu4t/ZfDsVf4OsZ7hKJL4ryQlifDIEqqZh3bwswCS/+\nMhq3NRLHgkA9oPc0Cd3wIpzRtfwWtGZn8XHs57RhP8NmDKBZWQNGtClM2UlU\noUEN\r\n=dOCN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICvKHvXsG7UcnTsJOoR0ciymx2r/C+lKqJ9qCHKkkjMyAiApG4P3jnufkzKyb4l++HGT0GVXcwCereSYO/MVGcyhvQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.30_1573518007482_0.9564204957673021"},"_hasShrinkwrap":false},"0.11.3-alpha.31":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.31","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.31+42f844b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"42f844b1b98a37359e436944f8268196b9609dfb","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.31","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Cyn4gW6iol/OrQ82si/1JcgK5imI4glT8MvKyN24ee2FRwR82gENKBsEuhKEyv8K6LYJWgNZvaXTDpYkBiZlkA==","shasum":"123b8081ac5a7583f1806578c3be3167f3b1f46a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.31.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyftDCRA9TVsSAnZWagAAx00P/0T1547k7ERCutFLWwt8\ng5S0RkW7u19DF1i0gDZLoIGV8tVUj6fi1Fp2rpVhhFQwVYuPFiXWg4FDKhB3\nxz5QC8XUedwkn6nLnxcxkR/2QI+1IdfpWGbzCfdm3VCj8kJil0vCps6yt7IA\n/ezTzkk1q4HbHk7Ky5msfmzpIKHPVSSSlmqApYjJYTqJ+0xVCWR4b3QFnD0K\nqCowkZDZ/O851LJp7GrBIUjCCBhK13Mp4CfcFNHXn8C0UIjAzUAqdmvYZngz\n59MlgJFqSz3a6Mr+jSHIRH3lsVgh8cuaLke3y6FDblBVwdI0SlCCg0rPl9Uv\n+c/d33BWS3/hEBk/coGM63HvQqjwuwszaAPN8z0LZfM5Bq7boQFQPLZdccYI\nEp0ImpqRA6qVDRiVf+AoznrlcsmE4m6tS0w6AQ9ssc0Ib8utFJKw8z/7R5qS\ngNE60vT4seKmQ4HTbt+vM3S4TEsYqFD54Dv85NpO17mKxKLqjd1qx5LfDAZE\nzNeyLFdRupGZrChOC61MXMoUA9GqynIpukjs1SxrI7aW3fMvdJaaOeQJUIG6\niS2tvTxPv1ETG8MxtSbvvZhWrULQ9MOt5hhbM0cfPnXljVu9zf/3L/VKdXqR\nqAhwao4ZWKfRJRbfIvJ34otg2MwC84p+1NvzCLimawzUeyMo2NxAZQi4wIZE\nEGi5\r\n=W6ta\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDaZBOHpdNng4VIy3QcA5mlE6np/MUz8ufIvvkB3J0W/wIganAgMaIIS1AlrBobgYzJbKftNFWhxisugSo0CgVka1U="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.31_1573518147130_0.3108864589452236"},"_hasShrinkwrap":false},"0.11.3-alpha.32":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.32","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.32+486b258"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"486b258287b6a5efa672407317530e860fb035be","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.32","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-KSnAI9ZCh/UximS+fM+Npc84eZdblLKGIkzjxAfI6ao7cYOeTN6ajHzmDMv6cnzHypVLIeGvJ+rt2KjOeRdJ8g==","shasum":"513a11d2aa6d2f7782c862f641c36b2515bf82f1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.32.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyfvgCRA9TVsSAnZWagAAVwwP/0XQ8mlh8q/NJI/jHpo6\neQuTNfhMcGAYLOVn9vJAyKdKtIPtPu/OU8wg4KyOzkQzIfFMoZfhQ4M3hP6y\nqm08YGH0/RUQULS0Vo6aS8g6q6vkeLoH1NbMjd/gqlvUwWWezZCSvdxGGbFv\nruCTpN257xmpr86bqlvNKxdm36LD1ak9TbScfRMyfZ9LXbyyLvHZEbwaMFCb\nfThojxD2RGdASPGLx5fPWyZG/RnTJmAkFMMqueK8AVuOX/YSbSCH9mXLk3YU\nrsQXo0QWzOgba5DY57y3MzvHSEJ3lQDXgRFTQEtY8frZ1ixwrDaZN7/kAP0b\nPEoOESrcVMeN15eIHPodiIkqxr2sDYk6h7vwupLL+lfV6yrvOQDmYAuAkl2d\ny8lfvo2UkkKEJhd+orF6BM6TPIUCF7K3gXEcfkr0Fby5xbc1zeMs1jiGgFLo\npMTLZTphdAdZ66UW9S7IoO5dwro4yJ47T2Ip71B4eWKtOmsH8ipzLZjpE1ut\n9M3UK978wi/faDndfspEdBKzDPeL44vu/w5N7GD6xkNJcn5SkH8UCWyoYY4s\nefflAHjIhYkagcUWoeVt4YILTCJqM5IyDUZgd+1lsJv9vEixmOv/npeOQkHT\njCZwmQV4SIDRgD2lLohJk9/CbjHrZeCQgUiWFB25ltgkSZQAMds7ylgsOV4z\n7rd7\r\n=vPK/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICFZPSNociW4Hkp8DQgZ0vNxWGnbt1adhGqFNsnVfMzYAiEA5pa5wDcMy/EVUPQF/MKth8MzCCrz4EMOzxyy9f4fYQs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.32_1573518304357_0.789604616727837"},"_hasShrinkwrap":false},"0.11.3-alpha.33":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.33","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.33+c846eb4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c846eb442b98db82b089b26f354645e02a21ec52","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.33","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0it7jbEUkHs64vpaM2KAXRDmpkU0ckcd6ry6ir5YCzSmTgMXElXyaVydvSAqwGXlfSziLlqThUKKKG/vYUBcHQ==","shasum":"7695f02cff9ab25f9288a0fb57f3dd65b40073d6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.33.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygA8CRA9TVsSAnZWagAAy7IP/ioLYOo+kmkwEDgXWcqv\nH76631mNEfV39PaAs9aldJ6Sw/JZjjoBxzWFelkaB9kq1Ocv8ESf5AR3MW3Z\naSQZ/zSqLGoc+ayNOpQXeLiT67B8+B12zwBJOx84RVH3JvjCbc9/Pd/p0+T9\nHDotp5qc4QzZDcsmw8wpaVrRs3p1KKW8wFXQ1Lkoe3/xUEfNqSs5+Ke08mDQ\nhhpEm8EoJVVu4svK8kaGHoKBSutFAt231kzDgTgKhjMTodnFvEX4T2RLilY8\nxTRnPMPIsg6CFGctsFwFdx8H+juKE8vi1iZuPR9AWFuJgW9tecYWnHQFDq1E\nifH4Zes/g8e2Oc1xWOkELeVcAhtykk/fkChpPM8mPG0dA/2OpidgR7vZX6nI\nv4cIxV1ZIFEahpcE03oz9FUAo5wPQLPxiwDDm2d3lEyUcw8ZuzH4xYI6ahiG\nZ4BoEp4ZYQTHDwPZS48no909Qz/K2hOxoB0kOHmyrkEwuN3fTKh9Y7gsJuQ1\ncfgM+GEG+xWAOX4XREgQJEUb5EYXmlEZhZ66UeilIy3Dk9qnIxUpjXuD3CC1\nK19BrK9hBX9kGfI8KNhzWrpFo3IimhYLlTkmBKLLAHJeHNfnhXPua89SGh3C\nNXs/BVMmdB5Foy9tyEP2jcxOJSu0DaaD+M54So2DOyIj/jCLCXaW3Cs2M8L4\n1ulD\r\n=mnac\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCESOOMLgWqeVaBUGTHHxPtGSLjIrpKr89zZGR25dTI6gIgY5tRx1SFPXI7cLjA1uVgi9EMDozPRIXRpSJy+L6vYXI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.33_1573519419880_0.8267883905906208"},"_hasShrinkwrap":false},"0.11.3-alpha.34":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.34","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.34+7ff81b0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7ff81b05370b517372e69031dc11f0b3b3e85dad","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.34","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-e5wvzxtxVv0CePxx3IySF1US1TRTdaqCOI0Z9ImABMfWdOmCJkdzac56z0fUmT+K18yclYwtiHQ8Cw+AAatSiw==","shasum":"7fcda527cb642cbeaccd4a8cd3c7ac8809fab28d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.34.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygCVCRA9TVsSAnZWagAA5ssP/jKTmDn18SGoH4d+01sn\ndpYG4YOWrhKgSFXDJFYPOJwkLshE5PhbajfeE2iZYHzYRPpn5frbLf5ltgev\nUiWGNkpQbh3TH9Y+kD8wJb9ZMuyRY9ricMhTktEeCYCuEPqB2tKfDgvqf/8G\nsWRNhIgfSMcGkJXoXINMLz6LEswt8BmATNp9NIGediQDDEMTeX8ZSExRPH6h\n5TAnJIi8JQim3F/R9MBoPYCbL1PvcHI4NvzwtQn7rtVewwCiTs5ni8i4msBn\nnfnEZPFeUb6Q5TufjAlTyTP9PjXU7+mqjcsS6HGNbXdp/tPwF+up9VtFNG5f\nPloUA/vOZqo+rPxrczY0YDCQR08jp/7AFdNr8zONtWUadmiz27e/PhOkkeWk\nppHyu9VSZS/IGghV+jxo/llJDS18hhObBRjiTrWcJwq2bVcA2tUWOA58V468\nr1XDOdSE3sRQf7OE6gFIYQ8koAqPyFHUbDPtMuU+e3sswClZ6ts9D7Q7bZ/e\nscO0r3Yj5kSgDknq5HWq6A5xDxmlRwNJOqKb/YhWnOuY86fX/T23zirlTdnJ\nQTPmYq3OkjOYrrMydCOhxAN4t5kPmG0Tt5KEvYHkhE66lk1JlsWW1EVMFR2S\nsPn9v6NXA39VSW8QKzdadQv/TGVfoigqaoJ19ObMQecQLOOAMYeOQ5GMgmNU\nR/DA\r\n=5l1M\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGQONI6x7puDOGSYPEzQTJazA+pp1iwBx1dbU6P9qTujAiEAmHWUEOzrTIH6Xm5HLkNQCZkAJvoyx6C6R/+CAZvNb50="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.34_1573519509317_0.6400146707875713"},"_hasShrinkwrap":false},"0.11.3-alpha.35":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.35","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.35+6e059d8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6e059d822830fcb08bc5bfafaa3c52ef23485cd0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.35","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-9LL3WkqVIFSXt2jVDESpd6HuhoORA1InrLfa9/wLnpXcEBdUnp67yaJbAHLxfV29BXGMR8i9PcQhO4yGti+F1Q==","shasum":"fe653cdd00290f7e221bb26e0a1f2b40b4d9ddd3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.35.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygLiCRA9TVsSAnZWagAABtgQAIAbnBi9ViLlbNdKHqb+\ndlbgzUWLq8SEDxhWCOf5PpHvNJ3pjCV9IBUv8eR5nBykkbnyHXRo0RibzSSS\n1d9lRA1k1CCLVtzmfvbwx/J+rE0SaBYiHaqtZ2V/YjROax6AhKPINrmJUXLt\nlXfrwX0osvUZU8c6Lpil/Tr4CUxaeP+Z/K6bGnU5HBz0HXgG1WcKueYQha9m\nUci8TH8UXRidfGj/4kd3ZK+Jj35Up1et2lYWO55Qi8NDeawISV/dWO55USfa\nVMJMOXWNN8tQojXTwQ++tauWMPcM7/0h49wzH6wucViSK56G5XcpSwAI/rwT\nXanO4AqAYODAqeSlSEPnaBCDGX+0miv5teljMhYGOL7BT1Zt37uS1mui3PPR\nxuJ3SVQtHUkN9ZF0mVAKg3x1uuQSZnWhjL6Zt+AqeDIaYFjoQsVVL/tcV428\nmrUJuEn5p5khsXgjPmyU7UvkwwavClCYn6ibDZvtsd+sTF6TziLt5/8nua0P\n540J864TbBKkRIKNIBFXNczxdCxHnqwaypIRQyYn8aq0Netljot59R+l3RvT\nMg13FyRArMEbU0Ip0vynP3cWIT5+2E9Q9pMrcTwTIG3rWpK/H5NowjiIbHKf\nuLsostqEysdl4Y24eYSOLEQviaMcdjBL4rXw4AQcavCl5yc7GrhReHM+Z8mg\ngF2U\r\n=Q9b2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDPSJD0LrgJSZyHNcBH7VQkmLboD2l1ad3XktfKQNnc1gIhALOF+kBCCkUEuFL31Ae1LgW/VJJNx18q36GWbymu+EML"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.35_1573520098026_0.47459419938312997"},"_hasShrinkwrap":false},"0.11.3-alpha.36":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.36","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.36+65b325f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"65b325f2beb8643108a59391bf36726acd267269","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.36","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2lN7wDhoA42TmHGusSaEle7iAL12piUbzQLfhXsBZwBCqjlVUFTFYT03MDj30fhsmpCBtd8uUANakneNGhKcFg==","shasum":"99ffdd7560d0877e430db603e7b1795a4672cbca","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.36.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygS3CRA9TVsSAnZWagAAfSQP/jeNJS93mtvc2Ua5ZDgZ\n9ukEBOlhYheQQGRX5Km8sdx/MgI3DnHsuw9InnFQ4L6YsvaN3WlvHkpaW25h\nzLhA/snMw07SMRCEJ+JSbSFMcCqxU8riNxZ/O0gSZh00FP3nNiN9f+33YQki\nzsmrebvJWReetddOQTPoaggmG4nLdKdmpYB0FRK2jmgf1D70D1q6X7IZn0hl\nSvXphKOgbwMBTXxi+2ErDILaTFYz8xYLQyn/VGD82366lOscxtFLZB+uGgGn\nbIk3A7DajlQxSZCrRniI2oGggTvIfduOgkCcR+OVDkICudlOPj56BY/9eJLX\nkuDvPwJt29thLuUX3rUQheuUn10ncRB2KJHRiqm9apQ1FE5nyOE+xT3vWbxa\nk+JQKuYzAHpaC/YzRJzuNskkhn/l6q68ILndoK9ayVh7BekR5oFS2J3HW7/2\nEYPzHIy8kRQZ3PWknAvlKQtj4ZiMrHs9VpzujkWqOgxyCaC5xfkojOCtu3uj\n5UX1q5hjJY7gmd7lrYMSErxOKCfvr0vNmUOfRCkzOIRTeF0FC90vOwk3EXrU\nIh8rfbnqR1n1Y+HuUoeFODg7FdxYNgOad44Xv5TzOGMtEfi5EMtX9HAp8+BT\n4rSukmV3eFQx0/P16lSWrVSI6uTmpFl39nzmm8PKkyPLifNc5+23Vx3qtc+s\nltxx\r\n=2KQZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHY2xFUH0yK9xfgdsg2aeN0bmHjfpbsjZUr/SJV9rrAjAiBwGhf10jv2wusesuXJWThuca18k0PV5ZYen1zG/6Ykgw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.36_1573520566775_0.20295486677345043"},"_hasShrinkwrap":false},"0.11.3-alpha.37":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.37","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.37+be6f92d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"be6f92d5a2360d992b2bd507111e20141384eb3a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.37","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-WuLW2MniSca3AOibDONdLt3qDpH0+9pPnt8cA4yqrumUBFbUA0KiQfSwWV7ORA0F60jrJRtzlagI6oS7qzYDoQ==","shasum":"e69fe2cc3843751957da9b765a713963c9de2171","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.37.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygXwCRA9TVsSAnZWagAA3scQAJHLIl32AE43Ik711xiI\n1tEwVDtJk2yTvUqhVW9524S9eoj6WEHFRv4ME8OAFUiSqLZprA/OQePRFOLk\nmyQqMIOEWIWenk+j9WjCERuq0olAi3jOeUuKPzq2rDUu7y+UMDVWoOe9bLyq\nEOtcRwQFEdToXG2lT2O55qRjn/133XInKTCNz5Y0eq94OgfX9DioWe5joVpf\nwaj+GDm8uRjjARDCPmQdf5olKvt653+cOAbUkMwCNWMNiLOyiL9kJ2kMcClP\nDoMqjnhcZL3KzQ5khYd3pXn++l5MXu4gnjSLWIRZMNYutlZzmvFeNeqNXYCf\nunxmQSCNnfeEV6ujEUwq9fyzqzXr56ZX3OMKn0udC2bE8qgnXLdHUS28DJa7\n7jhod1W2OSwyb1+Vv2smzxdd2dFL1c5RuErGlBxma9dMY8e9ho8wI7S/7g50\nRs7g6N61UKMtZQ3NAJgveCKmx1iH1wG31lVn0EEjts+1lECLXj1kB3YeH1Wc\n8fxx3Vwd1KB+oEpQB5XCrkqtLlCImlh80t1KMHnB5OpZY+0fdKCC49cLv/K0\nkGtz/tQspMVlnkaPfX0SIl18MOhOBNJlqaoGKzcx3tMzbONiKWxnuUlnTlHK\n7mfjnzKdlfBRXmMF4oC6P8iFQFZneX5xmr6ZaUsL1SMyINCwlbcDiQSEaehl\nBoKy\r\n=HT9E\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDX7vB+rN3b+mJOOKr7Zfxd1bTcMr7kVmQHgkj4XrbaPAIgdmNLjQsTKuypIg7zbbJpcLByyA969PIXSVpJCuUBbNQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.37_1573520880358_0.5095386410601306"},"_hasShrinkwrap":false},"0.11.3-alpha.38":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.38","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.38+50e48ed"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"50e48ed94008c73a215cd9bf9f0968f427217983","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.38","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-66d+rH0zy4pofOp95kzrbzek2ZjSzISRsBmLJcn0OtZ3UeN4V636s68bGxwdqdWic6I6FTbP9cfA9NB83JWhrA==","shasum":"4a4eabda155358aac1efb7d83d16cb927f51303f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.38.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygi5CRA9TVsSAnZWagAADykQAJd1UjLjUFghp1cTSYIW\nTSDGc3dmEhMUICy/Mvir4RIkV9bJcJNs/GrVyRtMP7TjRzS20mwOqhoWjGIO\nkLPXjeu8oIk8PIgtFbGT6eFLX9c1ATHi8vTerqCuhfxxxRz6TYaz/7Ebreog\nTL2BM+GOKlrkle6fQeEMHqdzSq7e2cahbk6mIQICgGUu31MJyRdCkVQhKfVC\nKjB1k0cEuQyk15arKap+x525Njp6RF+QpyGeKq0QwJ5XHAl+7E4WSTU4CkTv\nUEKYuJM6cI30khyfv5AzRf/WxeYKmLu/VjYENyy6V6IVhpdzjFUdC8daVhv0\niGMNGw8v63ClJ2D6aAdqATnR0+2KIPfYQJSgC7kd7ySq/UYkYx32UA4xB3Sk\nkQGJlrM4hTBCWV29cWDubS2UVO/LvO8E5tzqSemU0Gtd2ucxmVvQ+pbKvVGx\nb8vbI5fHo3/1KnIJtZLzx+2M5ASHCYiWo/zssVBIR57sfaRmqET2hrau1820\nvJfgMMH1hsc1Rejy63BqfWh+GoL1AarR6J3qurGN7lpgu+qGve7VAe3IMr4C\nuTY4gOM3MMcLDI0Io8T9S2eZEkmHR9YsYOj7ERk0Day7QWhND/6HpX5hDpTS\nYcPYHGxYDMYNcWPX2yoqEXhlNVWnRuQetaz4+LOgelguAPzv1eREjXGAW15T\nrba+\r\n=gHFE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDwWNScOXJAyoetMqycK6BzTf69J1IkX7upY/ELFS1UJwIgLeEfrOJmW/jsLqmDBXO+vPkk91Fa8moyWU5HehI5x/I="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.38_1573521593107_0.4901178169283842"},"_hasShrinkwrap":false},"0.11.3-alpha.39":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.39","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.39+26f6f24"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"26f6f24967d0f559d6c8dd1f4e8ba77cc8341fa9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.39","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bdJcvOpOUut9Qvz5S5o9yM6lQCU0ZKqxItPfnG3iEOnsiQgKCCNcQAyYcbBo3CufEf3BlEZnprieb8fjUV1HQw==","shasum":"5d829c47401841b6210aeb36c700e6ccc1e9fb0a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.39.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygkHCRA9TVsSAnZWagAAzvwQAKMV2g9xEKGnVibWdf4i\nbYOEVFPVJx/0ZmAIShwkelO0oGvYXCnOToYA7OdmdX50v0pFzzxmE+nkxjqF\nSyyqnFHFHdQZRoPOypxmRGW2u36Nbque+F23Whp+U/XCEAB99sawECWTtzXG\nv4OCXOzCXL+zFacvoiPUcvfkwdbOdsZCG08H7zNa+j9N1y7sQBFS1M7lY67r\nyyBnixyzNZlYDDs8MGyiy9iAto296Ay+P7VC7jrtAX9M67GZ3PqhpPlb81lh\n901DMeX6XlyDLoAvlumSev58lmo/ijb650dMZct+kDhE4uJXgmj+v+ZUqaqC\nTBnMTB/5HzbZlnZLJ2XOOd3zL+cFSPvm7CrTvitZQdxwuF1TbGLhL28DGdxU\n19xSARt1QpAqYuOpO2b9CXiLiOm1xYYtYb855S502KtHc2HxGpg/HLxOBF8D\nFk3NirmshxPQn+bu/yjh2bZxrAl4fvQoMtKZvvvYIeawJmwCf4pObt+Y1FIC\nCAfbFaJFbc08mJrzxZ3P4nhCFSiGKduS5XZmeIBCug1eemfYKCirYdng190Y\nv2sqMwGeO29XDoyU2QulZvlHw0NEvLCTx7U69+7lNzCdagRDr6lwixFiRFoo\n+o9kuwLhJUdXbZ6OE6ONsu4tRiuvQBXaqUwQXTAA55IwS7hquQ2hxSPlWMlp\nkqGw\r\n=D2wn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDVMZabWJTYTG9av/jTCb7awAw8Krak37Xd4B65fb8S7QIhAO10n+sHMo2CJGxAtiTcmi/bhoYOJt9HcHlgGe5VZGVA"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.39_1573521671244_0.39752023403594294"},"_hasShrinkwrap":false},"0.11.3-alpha.40":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.40","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.40+173f19c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"173f19cb4a633f5e6adac529fd2d25db6425d5f2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.40","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-DHD3pboJ2f8/s9AfY7BYYOdgRH/UvQSdPoQkC6XHoAoNrQ2odNoxFUUj3yyC3ocppcU3+KtOT+ItGXXQENHlCg==","shasum":"448906900c6a27f1be094433b4de9a614ed594ae","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.40.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyglNCRA9TVsSAnZWagAA5/MQAJqny0VojLSFl42UYskO\nVv7sSYOyQQOb7bFmPdq0/LYclk833XceVvyaeBDgVToDwzEfeIWTJsl4JZcm\nvsIoyBPf9F4zLtyIqs+t0RzRZvEXcGFzN/Yl2jtBw8VfIDZvgMV3nTh5Oz3z\nHckUEf0pAhpeG0GDokdZcJo+XfCju8TzsUZkqTuilN7LrJzGJJ6hXsS52odF\nacC1iraP6KV4IRe+wiL6Tv1cveFQGrwMSbPX5Am3aepvFkFPRxOCDDOE448p\nV+FmRUWcfn5+6XNxM40QunMsSFM/x2f+CeaIMWH0pOVM3Oxg0onGn2hKHhst\nlbO7QL3nF9CJ0427FJ/yC0oyT88TvTTW/JqLPeB17v47EWYyI1Athys9E/kK\nJVi8h6H75ynzWQXx4Ju6KYyIAYnAwHVAQlun6Ucy9fTSNxvrhAM3gSrWIMaW\n6jAYYkdTkAdhP0ysbedzSUSaq8dMwyc+gZSXy/N0cflmPMngUu/ptrogDr6+\nbKW9YuIbeR886tpZnePpIb9BkzBDOWwVmG2d3AjXXv/iTtKzKUWXSJNCao2J\n7WMzBYJumH+uxIxOgPWHX+i37sg/x/8c+SxrkN4rd0nhrUYYVpFBhKJvlshg\nXUNsIB4V3nDjCE7ousjfxTgmNScGA1dPAJ1VeljIEa5wUKHup2GItzNW/tAd\nurc3\r\n=tRYU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFjvq0DefbpOAB4r5JhjC0OSR47dnDFCE3tOI2PvlRdFAiASSN/uZWMLCPxRreOvsZShysUjkAPHepzSckyFGtHarw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.40_1573521741232_0.2833828502346565"},"_hasShrinkwrap":false},"0.11.3-alpha.41":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.41","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.41+ed2cde9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ed2cde931223946859a26c086c8b7ab489908693","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.41","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-je83eV7L8eJ9fpdothAmdQS3MEL6ur9bj9BK9eh79fKcHfGPTRTCja9AU67iNt9GND7f5bWPWXAccmXANMzAIA==","shasum":"6077b2aa1485ba9863f3c5b4d33fa5fef9ac7e17","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.41.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygnLCRA9TVsSAnZWagAANvUP+wQ/qW2J5VJw0FEAJXzJ\nYsZXBBe/4ZPGn3YGMLmiwugxN6cZqRFAGNCW9rrFvQ4yzW7Kh2mKLKZ4HUZw\n5G5vmveBMBLOj8V2y9mPJY12g8WPT8vCLhl0UgJDBXMFjD1mvzTw5FcKBM77\noC58wY1zMVd6C2GfQl/Q9L3QBaYT7MykyJFT9i+EMi3scE7yA0YeyZ4ccHUM\nYJXQo5B4pVLE8xL5rfCxHPSUGL33qrSmrW194O5J2AOnzMKfO7fRGxShzrOJ\nTuwUE57vq8B909IsvuHMnDKvr5Eez/P/LrgaJ9tsosJwLD7Gas9dQx13FQXR\nt8bZu4myLAFnPdrnlB0FXAyUIxn/+qOEDIk4e13OKEnz9VX3ty5AQKurlX61\nsnyFRbyy+cvg6An88uVFcMYRq8Mwp6BgSVHa6ZLApyK5Et1zoM6P0iPJHqUF\nysesnjyvBIHvJjsSSs9tL0LTreQ9Mz9MD8WuSk5nYLVlpCsldzPEe02a8JaT\nSG0RaYYm1NKhKZeKm8EM9kwq1TX+U4zSIjyR6RS5q8JbK2m78dCATdTA3Lk6\nn7SGqAj787uRWnq9kXIbqTKp++orHsdqoVYDs8wxTMfkKlbHLv5NsJ60pC82\nv8J9Dq6rFHwtxyJnawV62fJ3u/4GhXP7WbiLW0KBFzcs++cnSgwuvSYQZ4u1\nvQ6A\r\n=NL09\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCe4Dyv25xq69jG1hcPA6MEuiXgKTuv3vSF9a5rEWXudgIgTl+WClX0oYtwDP2N7WLuBax9a5mdoink9LOgylB8h+4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.41_1573521866961_0.4829556101482497"},"_hasShrinkwrap":false},"0.11.3-alpha.42":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.42","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.42+8cc15fe"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8cc15febe7abffba5a6c0ea9640c077114c201fd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.42","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1i/F2Ml54sDvxLH3TU7eIIa1fSWhcCTzUWdeLfOthQR9qp9gvmKoZvBNdlFIopx2wAiEAogxc0iYAPE7Xdi4EQ==","shasum":"b711fb935f6bf2cb62feeba2f631e99976df6685","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.42.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygp7CRA9TVsSAnZWagAAfzUP/2ng3ajAPEB/fwONeJM8\nXa8IWcuPlf2YgCYSd9MEapsfORA3D85lvB9r0wfIPIBQZXk4FI3XuC7tIBzy\ncGT8puO4ukEyGBK/TAs+PWcBY5pmRb1oOPRTmAbQB+CpEEP4Bj18R1e5V0Vi\nIRH3b1u28tf6XXdLD/RX1LcOYoFo/No695ftnQSjRmiJVahJV5J1OILoATCh\n31W83sdtShDiIjNbRAHotqhYRBwY+R3xpmUDy4nFR+EDhNUg++TiGlXOOMTy\nsLZpiaRgkkbyhvpNnhNPiWt7L022IBaa4ZVtDDJl478Nzuo+pj9KYQDXY3T3\n4EiKlI+Wg77pIbc1iB/1tLKiiJVuCWSRF/WXxFSDjNsJrebdlmGCiQD8KhRy\n4AHxYfQpJA9RJBwINzDqGBbsEQLbFVc406TeZdUDU0qb4/cwWJbeCQtxKcdY\nXStQYBOdEwUbPuGqgnz1G0aHkSYlTVRYgXa4jpPVIQ0i4q6m37wY+xfsK2hH\nfWxAwM2A0Y6gBXpBINHuF7xjQD/SftjVhxrpUNBwr3t46cAQSxRIlNKGaf7h\nu8Clq+OQfN0xSY7b0JTKRxVhpXPm6J8tMyPHOL7J/oWApGkvPVwd43/6T0CF\n2/Y+uHV4QZKwsSyw4HSL1taqbTb1L+3uXmVcULDiKjY1RMMKkb+vpLtvkFOb\nAU2V\r\n=OW9m\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICPbZjvmoSgKOnkeyNH8Pt9pW5PtPrvJbf3j2yJK5mfCAiEApxrhz90/FNL4IDgYJkpdJ2Vu36Di0TzKZZHpboKE+ds="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.42_1573522042645_0.41917079887258835"},"_hasShrinkwrap":false},"0.11.3-alpha.43":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.43","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.43+386be91"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"386be9167808c2690e4c456ace00942865320122","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.43","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-QuSEHATmicDUyVoHE2DLwRkZ+cuk3vuD7Y/RbjecS/UhFQQOSwnZW81rn3YGeT9R7gG6DvwyaXP7HV3STVgSvg==","shasum":"f4fb494cca0ab1d1c6ac532681b89ed7be093c52","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.43.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygrqCRA9TVsSAnZWagAA6WIP/AsUX0Y7dA15NykpKPXa\nAiMxwvdzFPohYrRqrcFosqwb56NxPhaQQIrgFttPwyjEt8bdqoYvtiG2EuHV\nlv/A6PGPs+TJh6FCYmCtxvRRJ69xz8+vkU+plSSK3me/BxDybOnYvqL0ei+F\nXUU/B6s3W096/UrHTTddzcKXXuyRCiWalPgItCCY+ns2lc84HrXgcjaDRpAy\nm+WqkMOXuW4YP4XznECcpU5oFr/A9C2w2WwWfYTJ6QlH7et/Y27t9Xj/oY7O\nZ5QkykGg7tm5saDXlFb9mMjFGGpnjdBYQoGADW4Nzc/+Zw3aABAJSDQXD/cZ\nL3n5EnJniZTjp/+fC4UCnRs5PGD2Y/qHR+YYJkvWP7fQYhdkuiLheAcBts39\n0IoFVDKNNc9jby9OjJfeUM6WtJlbYNUAhAwCUV080WUhSn0Q2enDZxorgmgN\nsnIBVD/WzNOJHpQUq6C2E1Z4ssUI44iuYpHy/rgU/25Jl0vafaDxEs46Q8O1\nfvYcaZG2KLqoTg+GfgrZlfBCmGemuIpUR6LLY7aS5qDbuvseWdk4UiykuI2H\n5LNAAxMiv8ZUTnuNQlVRIXVWlhA3vTCBw72qSsxU20i/ZpZCYOTdmTYkWkRC\n4kQhLDOnXJ/3OMAUkGJ2k65DSFxek+lqqXmDkzAgyUdt0+yiouTwgadTfsyW\ngNn5\r\n=tnoV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC0jRBIDRsk1VvBJ1CwwwsRCVpumvyjSsNHwe5JmbcQ0AIhAPLt5LMVrby4rHx++37aorEbXS2WuzDnyhOq0NXmnuxG"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.43_1573522154215_0.50146840524441"},"_hasShrinkwrap":false},"0.11.3-alpha.44":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.44","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.44+84587a2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"84587a2dd1a252fb56ab7af41b0deab2c4c07c1a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.44","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-7eRJ7h4hTRzILIj5eENFIXL+Vkm7s9429jzVhcoykdZO2O+AfbrpEJkuLtkCCY9O5cNpEmnE9+JBie0xeCSqUQ==","shasum":"dbe2c418ddf74cae92cb6f50cdbd528e0d273bb5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.44.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygskCRA9TVsSAnZWagAAaQEQAIRoCjO6kUPOO9JnaXvx\nDKGem7OeII46Kqx2AmwHWoBZAdQxrFP6YKqSVcpzVDiZ9y60ReSA+CkXXFtB\nMx1kLXMt6mWd2HiUEFKgiQIO2JutZJYtLkDQFKLmfPqlTqZPe3XKIkPtyckQ\ncDyc/J00bDxjCRSGUEXW9hWyYFPFLaV31yQO+7o8ypbfBSKLvrx2rg5Yj7nW\ni6nCzCBuFE5wU3wPheOczBRdqbk7ZtATOsI1jyGbA1X67kBO992uol3B4l9h\nzWwGGPs1BtojvojNVRtz+KMPj6Sg8dCFSMwdpZ+jVwqVxKrp2G8y2J/pXrm0\njMMzIyfWxyPMlukCagkE8jqPkt7fKjNo78mXLSachzcwJ/vzoI1Z3EQtTiW3\nye33zZf++DttnWXwUH91DIWzCm6nRTLw7/emcgOPtnwFLGVoXvQYmuNdNqdF\nZcU7GfQEkYXtfVl7QlQNQXvT53YVtaiVPSVvp/pOQCyboaKAe/TGpc5MKPiH\nWhgD0iHnBsbXW1Im/4ZLozfXxrGbQAul9J1Zhd4BrZ6ql3X6PYAW5tH+gpeU\nLSHOb7kswFnPVrc7GQjjCzEzDvjM+neji793t8iLfd49kxr2kJif9b15a9ZB\nRy29E/151uvoabXAS4gnDiwzbwOJhP6x6f/iaFhEyQ3p7ba1xCfc9Bv3a4M2\nBKEL\r\n=Twdk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCI8KpeVQsZOetB8d3PlqfW6MpmvWd+hHj6ibj33I+e5AIhANWbWmIe0edrJVzAlDgj0pff/5kRIInCNXW1U6Pf3hSW"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.44_1573522212146_0.7769832181951615"},"_hasShrinkwrap":false},"0.11.3-alpha.45":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.45","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.45+22d9469"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"22d9469724ccb7741a3d74e71baf35f0b4548f28","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.45","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-PoIWuL2PEIC52LdLxGjz4y22HVoz3sa1N1yKVFWqpeQOwMgsJ3NUR8FTzPXseAKLYmfd/ipX6bS8iNZjvIMhwQ==","shasum":"594de94023ca94c93137447aec8fcd6bc0c75322","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.45.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygwsCRA9TVsSAnZWagAAn0MP+QGxDQaIyzXw4tSQNjxm\nZ8AsqBhA+Dio3jyiNmnyKbe+QbjVCxUnnqEr1RIL3gZv3ddYikYsiss57+i/\nfrq2jKGpBYyycujJbG2oIWoOvo3TVGiyCmnY937sIrpKUzstaet1HUgC34Jv\nPKmxF1rZsr0/ihjlONudz+6tiUo78FWAsOH4ZPqMgEFXviALX9GT3Fm8EQqM\ncTIxi5d8IBsHLdIGVPxn6m/rEyOxW/d4eq75f/OGp/xn9iImC0QfjJTlvIll\nW0svaZpcgZK4ak+hFxEqxMKd+o91EhM9q6KdX64TE6tUMRdUTMZxzvYLRQ18\nlmumhrwmrvf01cejblTIBEvugH2dQrhj0peqUr13rJObGUWJgHjtgc7iBE3Z\nG5W5HJcQ7QlAHXoCjRMixjOl1y8T9l59+aHpNORQNJkvfPDPtTBV91sQP5hK\n+yg2Tri0dtTzlePLy8zFNs1GD0wj/y3r5NHTybxKbUhnBTx9gT0Joh1erHIX\nDnKT/Ubg5DiDn+9SV/8dYi5aKy3SeXwD7iBDy7zzGlVDk7WOZWs4gNPH0MnM\nVWWuuO6x3XVYLAc1y/8t/DwacW8GfEDGXTyWLgH94cAZcrJqH9WLf73ELmby\nn6f92j7mlxTCPYDfdd31EBzfrnWePSnrWo168FRi0/FTF2sAKUQD9uieBObO\n8913\r\n=0psT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHEBFNDo005jCt/VoeX6Cn+EotQVTeL6zdEK6bcoB9FWAiEAzZTa2nVN+wUfeUR9SQ9jdADOoWm470GpSsJTj3CMvwE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.45_1573522475603_0.5682407753220393"},"_hasShrinkwrap":false},"0.11.3-alpha.46":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.46","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.46+2f8adb9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2f8adb94ebb71b1712fc870fa1dda71a2d937d81","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.46","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mgP/OkdFQSixXh8Y6ze6I1qigXej7yfywMqOBlca5kKSWXxMmSXYrdHXzc8aqgPqW8dh+eYb7OEHuphNRQMa6Q==","shasum":"0cb6080303b2117c9d18ebd8a3cee6bbaddd5616","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.46.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdygzPCRA9TVsSAnZWagAAQDAP/3IHNUhHNNNghY8p/+v9\nmUk5UvYk++SlgJ/V8Y45cBDPWP0dCShhdjwQs4hWuR/i3mHwC0up21+xneos\naYFNu2mwKdkLqnhz7qtuxHzg7LJfXkQVOrGpfQArx1+VSVKWnX81zR3uFFIs\n3jr3uoxfwmk/iz49DqoY1li4kBaGzcMavz8/4r8LPKBCV+6tI+HvxqXQRfyh\naiZN1bTWBLNgUviS6cY9PKIbRDjFN7lPgLj2lg9El8yr6r3KVnZr+BHyytoh\nsjs7BMcLxAF4998NKgT0qIBLLX3D07Ed4TIELiqWFZhFgsSm0SsYckz+ypDA\nBgFmGXiBM3LWJTFaCbMCtvRgkhuQf/HD2uGIZs3JaIzuGPty5RyKcpNPErxA\n9zRvTdrcg4fmwq7yKTWQJGIyzqhnGoFRedU+sKl++c6IFJ1WDXDa4KoK04Lg\nH/oO7H6fGk7YBArwPto2AskGcDnkXYXOQQ90O2/PxtKJxJfKLIInsOC8V4GZ\nj0gfQABIwjf5VRYT80qDvAVxjMvMbWEtvCFR34tntEP5SH99DBBAjsDHdFHW\n1qQHLMRXbs6vkfpsf0V4w8VEEQKiYlh9c/1A2HOTk9UqwG66eY6H+7DC3SZ5\nKy1vMC5qjxvcgXyx5CAVs7o9sq10h35OhWo6YDf5qE7/f4llD13JJohWoeO2\nrccM\r\n=WSEA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCoZCy32+QgJd4shRHmLLiNMhwLuXdxbdrjer3k+7VsMwIgCje04KBzcklCHM2b+ffac50yXGyZTBHcyWRJKVxIq0o="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.46_1573522639450_0.9577833858721709"},"_hasShrinkwrap":false},"0.11.3-alpha.47":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.47","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.47+d8b6cc3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d8b6cc35d7cce62c39a5e9d7770705128b83edcc","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.47","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-TOeC/nPwEuFy+dbIL1GyUg9Am++GTUDxXmQBryBxNNoUcdtuN1IWtaTR78Rx3ihqlsUXApFId/wmu2XQx89Nhw==","shasum":"195a63ab922af14cf6fd68290c38db5d60934c4b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.47.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyg2bCRA9TVsSAnZWagAA++wP/1bfSovnrlaUshvv4Moe\nsGo729wNZZy89KInze1fcExz5oGVXaQG48NKBkrGgzQ4QH3RPQmXBW66+DW2\nsnZmltPOcffygAetki2v6ZLQ4RWt5cpVwiECR5GJkNubZimvxGkpp6cH8y00\nBaIYiRI8kWAEycdCWcFQ8qjOL+JJ0CY0ilT/C7UYNuHrFF/yaL2w+JT0Lf3x\netM++5nl4h364S0LdFlrJ4vItpmZQ21Abnranr7XViZhRCgnWjaC//8eKBUQ\nJjqcoX41tOLa45aHtwwMzsDYbikZ9uLePX5y/E1wguuWrMcS3gj64xTdFC3J\nHXIPx9OaT/G58RA7xx/OrdADbrwzmxTMqIgG2EwgY5SY7ZYdnWZlwrSUd+Vm\n1MqOngjNcYtHSxqA0dRf++Bgfg1kRfiwGXJPIRqxQqT7CT6NDI/Aw5ab+/8h\nqu+5aXnNPMUuZYH/8L9nsSetDtz96pQbm2YJaYX1eLBZs6gpFNZBu7EQl69j\nFXAQsQzFCPsZ518aBCtAykTSIdYgDwE57uBCFcbUJxGq4zDCOgnxYqcBtEzA\nOZMJjRK0xVlTjX0Raeq+3f9qioQOhJdeKE0wkkRXqVDlbmjPBqZPvL+75HAA\n8MzL6YtuQ2DBGWX4yvhCC3Y3PlLxtgmMc0h1zWuIW5DxwK32LTmMzWM8kmgB\ncIsN\r\n=6GRg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCMkYQlNVTefU0bF1rf4A4Z7ua9QWVsggZVJ8lfWOQO5gIhAM/9vvOrdBeUTDzlL+TApDcEuFwIt21sMYvL7LkisdZJ"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.47_1573522843216_0.3339612195736228"},"_hasShrinkwrap":false},"0.11.3-alpha.48":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.48","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.48+fb3f2d3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"fb3f2d390da7cef59e206f190797e8f69d4e7b09","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.48","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ksYDgxTz5X3DUDx8Qf6R//za7jMGXZeLmuOl4aFG8ncTMKmactmR+8i85b3VY0UhM3mT4HPD4dnYEdR78PQ2Lw==","shasum":"baee2f249848b157b371648c16dbde4db1b83617","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.48.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyg6vCRA9TVsSAnZWagAA0e0P/0dWYycnas6JUQuTozLp\nPfcj0ylGh4aJQ7+RTB8sU2d3TZ0d6KXM/kVgpJVnHPwdan5zbI+bSljGIGMr\nIHehrQeDbqEakiSzi7byhWrgedJx1CFJhXay5LA+Qcvwdw9GQdUjDeOP8HMp\n463dJQo0cj7YidHvXfo35MgWRnWRchbKNjUye83KXAwlM6A4wuUtNMICclQ+\nxj26yta0UpNQG4LQrxg+1p4aXWTe4326kwhMY2ipnVdWvuXsymk4MovHsMEE\nv+7ewDHH2xeRsLijZWTjkjHUElKX12H+o0y5DsB7IYIv4dDuJhYADqEQ2h4p\nXIjbNO6cNEi8llB7wo+pmG/JW13e9r9mrZQeKO78lBOsSJRzu1YCsoM0d866\ns8lkS9+0u7e6tVmNGC6KHZwFhf8fEI21JIRSjRzZ3MzBEZnAUibe2JvI7UmJ\nfneZnf/ZzIaEXJ4tMz0QeVJ/nMKx4nekkaxc+99eDCAKMyKAe3WsVDxnMSo1\njvrX6f6YALwZ7f2a67WQzP/ctqoESJzHpOfzxtLdWOLzJjBCcbKP/xfjaAOq\nANoDADg1RsXf7IhZgRuT6rjsCeSsmddI0ySZTs+PHtAr2Rfu8P0BTvlhyqci\naxvMgP1fe8xeDtpMF5lSiMWaAcoFGqoikrjL9I4tVkgGuoJ5/FwxPpDdOV4N\nbHTU\r\n=iGrt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCLgeuZmhxLrLPsXmsLhEqgUZs1Mf3XJn/pIV930KVVkwIhAP1Gw0/j87SPMyRBb4zt7WMCjcurkQW8yg44GtU4PsLz"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.48_1573523119426_0.835240810167839"},"_hasShrinkwrap":false},"0.11.3-alpha.49":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.49","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.49+3fb9df8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3fb9df8e3ed2733b9883254444c172ae13ea77ce","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.49","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-2dbmZvd3HPtyzO8P3gO4kL+T7T0kwRt/AGTAZvrSTwhS2+wo7FKF9ln+2p+jVNPeb7uhOYcDILJ9Fy0G/l16Jg==","shasum":"89b0ef6f3ac96b875f05a88782dc5c03dc58f77c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.49.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyg8KCRA9TVsSAnZWagAAaIQP/32beL/3g42ML/TRz6wG\nuBjMxcXcxIYAQnAGLgPxjqFwUUUURW54AZ+B0GlK/4jxd+vPzLpsamcZHKz3\nkCxY7uBXPt0NXGM8WdCH0Yr1TSHfzL11JFhiWzSDISiD/6nuBQIGVhfBDgX0\nGbS5ve5Nq5I69FDMff1LgTLJ/1tKKk0qRBU2RtHwjkFhhSjRPw30lHpeGjLb\nYnqvfK7/hsYfrkpLO9YlNOCbd4adJrhOy9MDKON0kCKFOozzIyMhBgQb4ZTa\nKNOf6iSzC+fm6zqMSTsbkvWvibv6Fp26bDQzfnVuG21L92eu+BuQB/1m7if5\noTbbjd9ZYEp5yDMYDodrL7hA9lZ27UEYa2p2Rn6xCLg+N2imuVg1fSWof4X8\nsm9iyOr9EBbBr5kDHKvrpjMJe8XLuykhlm+baPKcvAvrhyqoNBl+R+mZBikt\neeDwh95HKfppClsJ3yyVRFp7YpslPhYWjApsGWm5xjxLwMDY0wE7azwLEWIU\nIcVnvt7EnMPpnSA1JmEFxgmNaiSKq+4FR351pRxNKaL4q1F54wUPX85mIs30\nrj0xcW4lKTTcGFA3ophNj+68Lhj0ws3pr75+305vAuBkfxRUt+sc7XQjo6GM\nUydT/UYcKqhfRkTUaj5diytRUDdHkmcu4cwiQyGBrqKZ4WIDCS+Vqsi9LXXs\n/DNB\r\n=JwZQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBsVfG3Ap/SvbocLvRiC2Z0yZCDcFL6/OCqPQHjRpJV1AiAemdzBTsKQLMlJZYXAsj4SUH86yBBoqQcQyV7z/ROBOg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.49_1573523210031_0.9148671132609509"},"_hasShrinkwrap":false},"0.11.3-alpha.50":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.50","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.50+ea37b56"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ea37b569782dbd708c369526eb57cb5695e6e3a2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.50","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-OCcd35DrP5p2Dtae5SVQqEiHE5JisPlYdfP7wvqKlP/LViwyG9ycfIF7SWwgVV/QNnC2hslhOL4Moo6Of/WORA==","shasum":"a9ef6c38adc4ef0ad392be5a98b645961a666c4e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.50.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyg9KCRA9TVsSAnZWagAAApUP/ROmzxGqkk+bblOPLTq6\na9JpKSq8KVryecRfwry30gwSNR6PWbXh+xx/Vt7ob4OZX2fvtJuBDDJqqbdk\n1NUSvtHFjOsOSgnOyCRLkZcrtihprkgO9wkSG3VWdTDSN4IIZv1DFAUPqJeW\nbDa2a2Lj3ofW++X8mAJUmiGaByXBTbF4sNnMDV2i3DjZK1Uu7bvi0dNoj6Im\nM9M3e65pBvvG4AzwNm+l6fhcpkAxYjLx8zT8tXWNyayzhjlcsWSRuQHIkL/Z\nBMqk07oYxnEY2qFwuqryEtpFfDhoo1dBOBQpkK9tHNVEo9zjQQonmqLA41zn\nO1omk+sFLb0qtOjt7bLjzdZqhny0YJAwg3YM8yeJ5xxIBDas6hyYDDwdMw4h\n6whrwMqt7vzjdGQ8FGswk8Av6WOSWWTiKvAJNd+nIkIaDN1eLNqKgyMfhaj1\nihhKEyZv/6xBp9tnJgO1C9HzgihvZBsOW3BqxxyGEbneabncx9gYLynjmzip\nZcJHZQRDH8fAJCR+nm4DZIEHEWQ/fbUTOt342vl6KyzRj+FggyYrDyn8xUF6\nZqTq6JKnVFpkkNgMGoZup95hHqWVl2F2zD5tg1exd7YpaH8dGLG9su0F2PIb\nJxv8ZIzE+x4qHns4AA4EmH8qkHJe/OGsA74wz/DZge666CbktlAq4TKAL3x6\nK4Jz\r\n=nwdZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCRVW/vmy/6VO6vIKZ1z9W66WSvUISDrDUOj6893WIVZAIgYfV/aPgy9LDoy0njs+UQZeE+k0D+IDqe8+hAo6Nzey8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.50_1573523274384_0.6850293761171862"},"_hasShrinkwrap":false},"0.11.3-alpha.51":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.51","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.51+09723e5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"09723e54aba2104fde03ce731dba546b562245f2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.51","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/QImsmrmjd77IegCV3NeAqPvSSzgCYNJpts57W346vGA3xopKKNlBAJot7PkAAFj+q2oCQ1l2fhAovPmNHsKLw==","shasum":"b8f3cf9f56bf13b84ffb527c93b81c1cfcdd57b2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.51.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyg+iCRA9TVsSAnZWagAAXWIQAIXFGt+UGQz/UEFkMAXk\n6+jbtmCqCN5yXlKv1I61CGHtQx+kyir15FZjrL8TIxtw+oloM7sliFLEE3uZ\nkb/Hn9qqhfiw5NwjzLE9MEpPbHndGjmPwhZCk2mpgOeRIFGYceMNB01MhfDl\n3Y+yL3TB5BDT2LzNV1If7CJHRgLfofusD41gEoITuDbyC8D6iAV7fRhRLxRC\nn/+c5o2c07j6TLEu9jUTn2Uo9X0D0vwLYXun9+Ffq55Q53cfQX4sKN51JYlf\n/UTCcpG5G6lYfevp4lcWsGswaz74WmtK6nCGavG7c6ZdovMLhqMO9P2V49QC\n/tRIjAZ86UEDattasng0Ln0EAFOnb7+qXwv1/VdlFZmsSSrE2YThcHXD978Q\nhQTB7m32Ot/IFFsQ4JcPA2V7MueUuJXExFzjNpDxtLhLZCatresZvyiGHwyq\nWVFMYCcVxEac6wnrsMMN961gsGuarsolFrosF+XdHDnoTAP25GsDmb3WSu47\nNfc7UCjEcJzDvwSZYqz4dJEed+yqdAcuPv4aY281AESBH/zuCMbV6ZUynTBd\n36QScfbxZgNSTvP+BKkUS3PMRkPQdRE7oEuO5Vv0ptJo1qKsng4KgJQcBOj4\nwJr/vJvg0b0DR3HK/p4oZZzQ9B0Cn7TzawTBqQ8csdr5CR8kxVs34YYhfs25\nFbJt\r\n=CPur\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBXw2jnj7MrunTSPjP3wE2jEKXJw/D+qtdn6QEuoUAAuAiAiGJregho6cRuz3kayFiOJbBZ1oxXwkTbWpXNKskKHNQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.51_1573523362192_0.06854950498158585"},"_hasShrinkwrap":false},"0.11.3-alpha.52":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.52","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.52+70c5727"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"70c5727fde67cbac9724df978f1b2fbd76e42f73","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.52","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4iQ+8hV8yN2zgBN827TZ3I9tP//ZxXPEoI9IyG6ggcw3vWfPkF5moAqxwNbrW3gtAqW/IXh1KKVtr/QmLtuGGQ==","shasum":"1954f41f1f1a6cd6df2c43c2c6389e977af2c6cc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.52.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyhKtCRA9TVsSAnZWagAAk3oP/2Lq7PF9Z8Gw1Tvc0AFB\na0pqt/tdJnVWFa7A3Epd34qmz3VapOG9tvvvlj665bPe61QY9fDKet0hP7s8\nNMFmnA16E7X8iTplkwIeG3H816EDjbQh0Svc3XFj0yXDhi/5KuTtrdX15kpI\n2CXfBPw513zhMdMlRJRYf/6DtW36IVuzGgToj9CODGOG1PIChyjFGH5YJALp\nhXExJSS19lt3dUluqjfKQU/IAnomC3eAJGZYmqU+XZ2sTJEIOaupX7FhM9Kr\nF36bJvd1tDAeAm6QGGxQ/AoAOobG6wUtMauB2ZQ2fT+OLd3hS6W4A04dSMJK\nQ6zdkTJs3YU4r0uj8yCmoUMl1DoNQL4ecz/nPRK9EjuSW/Dv+6TLC9uxRk8k\nEyWwqHiAHIu6Di35dhb9yzzwhs9gi1v9EsDxxozZ9xkBa6LnDUSsHYwMdo6m\nZPM0pX53umgUWzqiS7ut6VtjBFtdApb1gF3md2rPxOp9yW2JbUdgW6/Zh9g8\nLqtXYfhqzX9dVZJk+5HURh66CcQcmOcUIh11GWBHbminkKDB0bhPhwuXhatp\n/D/6Q++MicNjCwCHFEkl/64IGWErBUyEhWkSGaSh9GejRGhfWz639Li7YrFt\n6jGiC6OK4Zxro1CaVWaMiX5SIL6GS5wOAj0knzdVA/MLJ8UY98+ROe5QtxNR\n+be1\r\n=/j0h\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICyFo+XWL4p6/O0I0Zv8Xrk2EU7/DfxAyS/q++Ibz9/OAiEA5leylwoUEPQ4+rPJFMVUXAAgRZMsruMmZYMDBORYAJA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.52_1573524141157_0.45707576072499"},"_hasShrinkwrap":false},"0.11.3-alpha.53":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.53","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.53+0afbaaf"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0afbaaf14bf2f66693078b1ee5818eea5f6fd8ba","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.53","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-wd0NvvEyWb6ofZJrl7IOSz6+cBRxY9QViRC7au6SVY1GVm6ZX+67/hKKD1ItwOMJQ5L1t8bLEIQCQU73Vo0IyA==","shasum":"8e3688174c4ca497030f4c4e2ea2443fa2614fd4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.53.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyhM1CRA9TVsSAnZWagAA7fEP/jSMjfvJQ9JRpBSdupmt\nVsb0ZJW+8jhrmjf+vgrZD257ZZL2R3/ODUCk1BfDE2ZYM9EKgT45gaOyobkK\nfRTQzU1uZBYIFSgFHYz1bXZyVK4xZ9WmS9R92BocDR53oKRFHjiaFqWn4YT0\nKIRJDbuGszVOzj0zxOHvTWjehfuKgNYR29b5j5o/Ll9XFFU5ExodrghF3wWD\nbqsde74RPwdgMN8C+drDb/UMW0Q5/uD97Fqfn2r26g1BaFZVEmr6ie3UTQ2F\nWEPzpvz1ej19I8zXVUf+uVBvzolIEtp79edeflz3SGid6jGAgtxwjpUfQulX\nC8vXXPPhr8lfSkB6gbTwv8skWkCDfSw8UrF5ikft3TK4BxhlwgAf2qta4EdB\nWA8y07LtvAj9/SXBweACOILzuziykGU+zb0JRmIm/gUimlz2sGEhMDRaoRa3\n5h5F5zayOIXnrsC2zAM/Eszsdfc7vLsRAdKWp+0Nxi206CMm4+3/QRsW2bLE\npD+s36Dp64BUDu3mVOfYFwDPD058L8oQ+mWOhRhoxtwPE6pCInYAzMdI7xOo\nIij5tWg7KqtsezaO+ReFqpX02wfwtbpihF5GrtasHKCc+Ugk3bkJ9GFS8CzS\nTI/oqbQHsZmYnyXqAq1XFN2l/S1qEeXqOKpK7xIk3QRGYNcECauRkterlqUC\nUCBr\r\n=XlP0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDo6uaRVawq9v8373rdIU7aOxcbozTQ5Lc75HrN7FO2aQIgHJgBJfJGZH2AkDsFNj5zQ4mdnwmFYBdja4KnVWqDulw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.53_1573524276996_0.5609457207368591"},"_hasShrinkwrap":false},"0.11.3-alpha.54":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.54","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.54+ca8c581"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ca8c581edfd580246359f2f555618f1c6178a240","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.54","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-S3tBs9E4zcu+Uw5aFgc+OeZ4OsuOh+VPVpsfQkllxxeZOvwMAqJv/J1zbFFNPqoe5IDMFXZF6USj01sKtf2QwA==","shasum":"920d2ee481b8295d67e8abf0bc615e52369e78a7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.54.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyhPTCRA9TVsSAnZWagAA8ysP/i4B3iozpVqYT4wBZTmR\nf4v2fehkLnInFiCurY0Kz+QUaQIh5CgEXxy0uXMSGxO2U7m5karg48oS/eH0\n9EYzYl9DQLhgFK4YZPbBbkRd01eLL9ik59O1whbayiD04tJaH+PcBVYquiVt\n9mUATNsuaiV//wFmn0K0GTW6Y/WVO6d8Y8ujxe+N9HcOTJ8rn/ZENYx7/YBr\nMebMfnIV1qIFpA7r2yIWWhGh8r5uYH+u6Rjju7xiKzNNrVasCqT4EcxU3qXL\n84mEzxFr2TlLEMIpIfk6hqtIMQE/TwnicBiCl4OMzjMwokezx3WZqeFF3jza\nzeUeZNQThu+iF530ADqQxDieJIdZzNL4YHu2WYkKEEKpvBbLCmwONre2/ihq\nPJDCU8NDbEN3C2tkn8amNPXj+NiNl606nHL3osvzHp+w8L5thWfEXlHRA3fm\nrlxBrxUVuBPGUOh2az1G9OTgDxO7jEJqFw16smWXhTDML24CQB2HNNg+oaYi\nZLrWMXBngHIr6wI5JbDckyXr8oCMD5AYMqbLYbSGuj+tWYS26SViKv9/8IaV\nULORJ7PooDov8MDfbZJD3PUL51T2+oppKDZIIg/m9ww5DFe5eag4Tc286L36\njYt03dIDNokUsOueK+dqwjQ8BHoVu5wmWStEqcGfwBCWhvKuhDmER6KiAaXE\nPC5O\r\n=6yd+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDa1eouIuhWGm8HOmrR5wKgZ2POVf1LINXh38lhzuSCxQIhALREVTdO/yytpMtLr6tXkfmXLGLlGK7T0eEuooXEIi6L"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.54_1573524435036_0.6723617122570169"},"_hasShrinkwrap":false},"0.11.3-alpha.55":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.55","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.55+1bc506c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1bc506c19ff53bb6cff68910dfdd70c83eb8b842","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.55","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-h061XdbzLwkFgGvITIvpInoCeAubOiacuSKZG35cNLVvAtuwPk9yKcZhhc5ADKvtuW/rRuD6Z4ps7CWQ9Z7mvA==","shasum":"3ab16d43bb831923a6b6b41599d37d4af59b25e9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.55.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyhU9CRA9TVsSAnZWagAAWlwP/RMw4WXuFBbqj1FW9jXH\nsTIT4qvrYJ6AcEoZe4Z/1xPV3xU731Sh6dtMStpLHuZaowhnsq3GHikg+2fJ\nncrrr2+c7Wojk9k7g0+vjqdSHNi7sMywzq54t+emvA84cGwq5+vWfoj+IUBp\n0QvP+SmsgFoYK8EnsXBp9qxl+sisJKkn8mVboQNZKHan4sZCbJyEYlV6w36r\nVR0bg1YbbpQbJpOGYwFlh9FKmdRG4IOHVnCa1dSZlVI6m4vN/HPsWrXiFHLz\nLWcBXmn9BC721E5PhfsmwTCvWRdU4g4LERKvyBRMKE/rNNrVtbdn3W1xSbF0\nTQapswNUkSG1Y82AvMWm6SmXAFG5i14G71/1FQb5B4hQAkKyfhe8kpbMG3WC\nYZBFwaPiIpGnKCG2AZmUL4RVNB1NvBbuFqwoXC8Svmc8+IHw8shN54Pq3uni\n/bHpaSXWVXMAWTz8WduLDrwfDy4361AUXjtn61LzO7r171D8rZUyQIhfmyFw\n47ItC69tSTz43b9EaMHocfMLpvG/e6ltLs5goqUrWYAB3j+Gfkek4ZYLby79\nSGy1OtKO7rvh21coXKzOGP4kwnDwI941NZUzax1cHH7IdRXqdj3fMYaRpWVR\njVk7YTksFSXVl69zAGe0Bc8Okn0MPTPEzK0E9bn+OQSS0iqUkgCQ7IHtLMmN\nBv6k\r\n=xTcp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDsVM5louUFHtmIzLSRHG2q1VLbfoJkotcGgLbiU72gLAIhAMXmwuMqk72wrf97/nE+AoKdoq1872z8NWtcnJAcTge8"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.55_1573524797455_0.02050538379672817"},"_hasShrinkwrap":false},"0.11.3-alpha.56":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.56","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.56+ba68ca5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ba68ca5a1e30947e7d7394634e297bc437954132","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.56","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mjh4y/FuJrCQ7lw/RbdWttDtznQw91uhRWVDDSncLxQJ331ehVuSpeghsju9kP9E5bMlfj47C7dt/kTO7qSD8g==","shasum":"5638130a9274f2fd9980033de9102efa0d84872c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.56.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyhW2CRA9TVsSAnZWagAAFUgP+gOtVzGeaT6QxSWTeEiv\nOheui9QiTR43T5+xI70qfRsL8PchwQncS78KszgW/YoVu9lxlMCUKooO77+Q\nFwTJhIWEzstmMTXmIN92LzovcC4r5a/urcGftIm56iORBXjBdkbdL+A3Fhkb\nGOayoSxoVM9pGBdO8Q3tPLUumk3QZOREoYgWXkiYjd3xbwpHHLjDfiBansQe\n2J5uRmjyNy4UHZj0Fkar6SIXwdc1eDI+UxlSi9sFRUBbU1ba3S1K2osJHU8u\nFo/2Yrc7MGfYCSdvGzqEyezGU7mBNvhlPtZQ+lTOdcZ8dzdSc1P29oWrVqk2\nyrm7FZ1Ylm2XsO0fvpvQnOsvzQXEC0bt3cICLszaLLWFN1dqIq6fr9tQzi/p\n1XVzKWM3+4QRwD6RJqfzPJtHozjhIeiV8GLu3Mwdzc53r90doio71FIF+Aef\nEsuGh3RAOM36HJkbXfWBXAvwXxn8+rKBbWXWQNn7QTteOX2LN62S4XTQgiLz\nr2I5v2t5ctsgzwFhASfbntq5IOtl7K7wZV33ENF1KPRj6tEbfzylMb/Rma+x\nAKZIYJuQgUxYr+N+GiKY6259IZ7TZsNOzM4WH2CEE7GIKX2n+ZJa85GtczBy\nKjqUcLd21cIOb/E8QkFB8SWK8hr8ofBgeY2F07mvO732mEVUl/+Zr+b5ATuh\n7Mmx\r\n=py2P\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFbcrfGdG5JVKpAEVLicMHEw2NjGlvcpdd1P4vESnK7WAiEA4EqTyE1aInY/znHMRU66DoXJGK4YibrcLxiPmcQhqVY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.56_1573524917865_0.24101066364563817"},"_hasShrinkwrap":false},"0.11.3-alpha.57":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.57","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.57+02dca9f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"02dca9f2e3ed8ed97cb1a4f1556ab2a57f75a1f5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.57","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-dWtQEqmoDCC0enaBFFrLMLB4t/D5CDSDONzw6vi9Gvk62X1e1PbiIWvPGnUOMBYujvmQF26RhQrJ12r1mEDZ8g==","shasum":"4d259e888f29b050788ac2a9c982b5b9913455be","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.57.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyhZcCRA9TVsSAnZWagAA9JgP+wRYk+jcYvlyzcb4Tq2X\nER3+cFMljzdQXGXhIuW74szX7gQm3HKGtt6uxCUKhmsneH2lKvl0ZZTCYPJ9\nTIVxbIlFuPQVkIhzMVnvda5pUoyhRQj6WsUvkpHJOTh1O3LOw6dbw6iadtwh\nGpWtltMwvDVpirx49vGP+Agoxu1Fzc2y90lnkVfNkOmaOS0pFwh3YDz4oaC6\n6c2AiONxnnP7vN1T1g+I6jWw2XGiSldYytZWXn7O7KMLfpEb4IXG1ky5tfNY\nLm0KdI5/MrUTqiKaDBZq2kFvFDQ5HZgeQ0vZONX9HMjbfGrZ55W8C1sixxYf\n3G7rUP1PGN2kAD87O4jcChd/zBvXacjwP4vU+fkphDNAC2B6zItIxx2EhdKO\nr+oYqvFR3K/e14DO27IcH63uWeyD+hvLneSZEWld7b3iwgs4qqJSnwiSJQpP\nj15uEhi+vOzDwsL37+51duCT9PfXzQPN6T0S9/vYgBcT9HMrk48tpPwd7wFY\nPJa5Euj/pATFBUV2Sy1G9bDCQYvBTiTL1E03cHoMkHa/wQHn71pDQP8v8RK7\n4FcPdTylchwl3gbeGsK60SuNgGTGY5wSErMfl5Co8rlE/0F/cBNDXMYjIGY0\nHwSMViqGHbrTvcv0BepKCKBnI7xjTfOFfXv8OPgUa5+ITSuLRaA8UKVvsWd5\nfHir\r\n=gpjU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHJtiLvkx09Yg3jD3ht1kkIafciuBIZ/T1ykvcgQqrJGAiEA5V2/DUzNttnBKiPtEbccKmJTQlAKjPFk9rcsLsKNoSM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.57_1573525084519_0.15874801334785138"},"_hasShrinkwrap":false},"0.11.3-alpha.58":{"name":"@react-ssr/nestjs-express","version":"0.11.3-alpha.58","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3-alpha.58+2c03dce"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2c03dce5b9801dae77ff0720db3a59ea4f16cbd0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-babelrc)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.3-alpha.58","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-RSnT2joBVLxYWFq9BMKVvkYmaveXgkm88aBXj0udWnibyorDDRAC41t8SNRi8UL22sFlZUJkyuFL8OyiQIPteA==","shasum":"09743ba59dbd384f19a09416bc24da10442e750e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3-alpha.58.tgz","fileCount":8,"unpackedSize":13762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyhnqCRA9TVsSAnZWagAA8HQQAKAGgeGwklzggFzFn8QF\nCXgvbYvSbsaihML5TdnLCdX/0tsgXXqqvvs3z15p8lRPOeGtBJW4XCJn8IS6\ncIuWFZdyxYCx9nbDVjrHJQ4opm+CoES5eTfxXs8CfXiO/OIg73ehbdXYXRmp\nzTN7SAMGqcoc/OfJ6bC+B+yy1qDwH25c4gslXz4/y/U+uBz2c9DDHXYzyx/g\nQzIidmCYNDWFF8MFwr88CR3povhbe9wGEdgX2Ei1eZUV82UOkpLDaBW3V2WN\nHVDZAT7Mnmd6N6paGDfwJZ4COtJ1nH3kEk1uQFGNFLqJDK2MNLTXtpwhP1UM\nUIkZ6rY6rpGoEEbaCeWtnpcvLvyGyt+RTzQpfrFA7jibsu7pHStxRkDCBa03\nZxj3C02xnbXHYixnpF5FHWeIqUSVobTmgHWmAxJUdCxKDYXGGkrIOQqqc9fI\nA+A8Y/cZbKQWQBQErhFg/8AV+ZBEHddSxMg/2/T7bo+Ml15Xj+4i1N/O4ZLI\nNiK2u5RSPP9s6Y6XWIKx4Ua/yz0ogIbT4IKRD5a/KsXY2BrONv3X+RFNJmLZ\n5pOu3xOHIXwmrZexhAUx7rglsS6QeXGu/pyI8J3ifp8WuUZVJ8CHIZeWA2cu\nDN6kd9jcXnyt/OX3+lNRJ06Ljl93/eKdrBkHAApXD312tsbh9RRtZ4iqC9MN\nLtiM\r\n=SIO3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGtV4PTyrBJi593eA7QOOt7Iucx94bP0xIX8xtJQkSlGAiEAkY7bBbn8RZ3u+UAUnoa9Z8E2gV+73Ere2bQQbJTkCV4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3-alpha.58_1573525993644_0.6261191427259207"},"_hasShrinkwrap":false},"0.11.3":{"name":"@react-ssr/nestjs-express","version":"0.11.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9b015f2dd083946b82b6a4f1a255c1faf55b4bd0","_id":"@react-ssr/nestjs-express@0.11.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-jaMDt0CiyGJAZ8PvhoaESiUBCOxwmn8XLkId5Nv/+VKNxHJdNhVxN6mKhsnPVNHpY+/t0gYt3BQUWp2VnjzVEg==","shasum":"332555d76b3c43d648eb96c6284859fcf004194c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.3.tgz","fileCount":8,"unpackedSize":13713,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyh34CRA9TVsSAnZWagAAuCgP+wcgtqqiMWfRukIu3b/3\nz4aCl/MIF0YspfZT2JD2p8dgj5qLapZwoa0IT+acIyPsJl/iVQkjMBFbJZol\nT4DurIgkPEqB6hN/pViw//I09LFoHAfOt/bCXsS/x2fyuT1OsH3flBl4Ebss\nnC3Hm/fCRBca5jLqAjEI9xsEKnnoKMfVEJO8N4pM8yOAyjO6GZbeaSKeGRW6\nlQ1mhQOsuOLBoEwUKGPSpgrgbkDUrQ3RtRDCEMYoJm5NlVauezEkuGQbbISb\n28VuOkvVJ4FkI5ZoVn4Gkt6jhSXFa5ZevG75vgLcyib/0Qi6vEUJKSzBw+SQ\nVoJNzjcccaniEQNAuttL6U62aZBLvPAacM6+zovlTdsSoSN2HWSQE6tZ/BCD\nQz5AIx6Fu0MRmiKnNJYMBQcwauykw+anlJvReXoEwgB4hZpDW1Z8de7KvkRe\n+/YZg5fVlaQrWeVI00aD8veVG4ZDYH5ijv1DjJJML6AQiwawhr0x/m7cx34V\nVkdXA1jwQR0jF6dm00eodfjuVLqBAj+iZt+51+XlVuhN90IbK+2xhhmgkyof\nAyYDdF/Ng/ycR/2t+XGdhjJCLUpDIEqxxexpSgXxBqbhTmpBXePaQam9oZ3T\nKqvjONchc9V1QMsbRuDlWltm7iFJU8oq9yC9j1jdrDQ7OJwsI+ToDWjSFqOl\nmGU1\r\n=O3e9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCHCEGUhDkzi1paoYHW1XMYSlKBVfA41QzycgnGJVu1dQIhAM8PRiGUx9XTeTS8nVA6v9+mvjtpINjNCQv2v6Dj9IOg"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.3_1573527031801_0.36065582501178217"},"_hasShrinkwrap":false},"0.11.4-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.0+d07fc4e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d07fc4ebf0bf796042e47e362aa908958724b8dd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-F4h0AvyoGr+5b3I2MgHMIVGTHf9eOQvHBu5UfRXvVVSRn7ksARAQ2TlRh7OPCAn24LxKmJEOR1DtdBAAVL/y1Q==","shasum":"127bcf9b9aa04998a2205c416c7b6eaeeaf64ec0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.0.tgz","fileCount":8,"unpackedSize":13745,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdykTpCRA9TVsSAnZWagAAzjAQAI3+aVBzyeHVnBW7e2ya\nKgceLG/BorEtx7g212x0mgWXp35MUR+miJyQdX1C6mrTR/11A86TFbM6OgQ7\ns8TWbMYrTZpUES2srd8RkodYB/91EA6ByWqJjdgbAs79CxOCFMcO9GbNsP1t\nSEL+QtTz6Zu4sNIZ0xExg+AnRL5ANw0AR5+GUsFshfY285HPEyUr7+i7imD/\nR/RV9wGCn1NgtGb66lZiZb5sKTPGBpFOTiITbj+NZGhX8+SeRp7Xg37mQ3WM\n2ggNoVnhnGuhI58gH0240DZZ/0TpXe6eBF9ZK6ScATdjClp9h2IsQHahBJ/r\n1vIowWhR1+fP246qQ6GKc7b0SeRh3ZVl3Em6fGLr4PEjDS1LLMLN5RZnOCcU\ndEuQ0HZ1knubYY/Zg7S98hBUELCgYJ9fRVfvhCCDD6rtiQCWXqo/4ygfuHyN\n+D8jLNA5/2KqNsY/9ZcvXcEAmir3hd6A12P7oeJN7wjmSdkXMrq1/vzZV4sl\nlzEdXLoexsgY28cuHwLG3r8Brd2dwhhDUwJoJD8DGYKLtJSyQaWWt9QYumP6\nZE/oDndYOsdGCB+LnqWhGiCvysrfignNzFckRsnm7jgVizs9DQ8FeMyIzIpP\nU0Q26XFUbLYgfPDRYTindM7MrBJO55JGfjuKSQaEV4gXSq6BS7BgnYYG1ihp\nxd+q\r\n=TrDT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCo/ExMS+aHBjor2Tiu+w8A0b0B2V7/vU/nHK93gO8RBwIhANjP1grHiwc5O/gm3UdxkARfUz+jlaQRhnyL7/Up4i4R"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.0_1573537000999_0.2950918593425842"},"_hasShrinkwrap":false},"0.11.4-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.1+2da96c6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2da96c649131b126080fa738e7bfc6c6a161f612","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-OLxlZdZ3FjQGou05vOiOMWad0wSY6gvkVSMuQf8SqRvp51+EhSCJc7cWsZP6XRmZcdHa4KTLyVkaUYx6aRoexA==","shasum":"702bd2d2106755c8208b31b28366d8c5ea336da0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.1.tgz","fileCount":8,"unpackedSize":13745,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyks7CRA9TVsSAnZWagAAQigP/jku57O4iAJ6cqEuJscg\ngvHxrkwAqYS4LTpi6TZ+IWhSdH1cY/BiPPo+AMmP/mTWDa/Hjekl6oxabjNB\nd+pweEedkYWNwoFjG+lrppR2zXBWLqP/5DHxAbJ49RsiS2TIQKgLWqIn66sv\nkYJ1dRfIftIy+Z/PG/e06aY/9F9SXVBtGjcqAyjtIMpZzNmXyIKH4+b/04of\nNMpsC09CezfDhGXetpCg+njjtAottjYKH7xR/T2mnZh4OF0zwrEF+fcAYi8u\ngSwRr69NC0pl7tad5GxQOHSdVsZFEyi7QkkyjJ/PIXJi9ORlqM5wWnoYqG2r\nNFD41Wvwsh2JRzHZ2QaTHzBX2HYsPP6dSoP8sURJ0f1a4WPSlpVhL1me+9A1\nGBcMXBEZlEP+uDaUVpnRPz542anPg2MpOyBfkzT4o3NzuiXitkOkQ3o1IePW\npmH5jDinXO27kh3zBcLK6C++wEF15h+A6xiI5SfmcXMYfU7oHBj7WY3pd760\naQhkz2cSHmfeTl/zz14IjETXP3gffsNFuASj+efQ1fcttVa+TRhlQH0iysMY\n3/GCJqiYW+XA14whZPtuFRDw7nUa1JihgdliDbx3qsOZPKYZvV71hCFkjw7O\na8wmaCQiXfy1m68Nx1QKWyhUVJBiN705nBi2MIxR/xwYJcHBFh+BszM6VQtt\nU6Ew\r\n=A1mT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCj3E9clSrAl8Z8g5krD8J+dC27TeAE8MsSvkz5NGSvkwIgWPKsx+w1kmpiYQXsKCNdxmGG32frfGpws21vVF0AcZM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.1_1573538619067_0.15608864908500886"},"_hasShrinkwrap":false},"0.11.4-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.2+c04e551"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c04e551f3d713464e4ed4127ac37dd36cffd0426","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-UOsWScr0NYMG1y3GXCqawebww6WJI9/ZY2j/LJocVVOfTu2QGIlfyyFjBmPvSfX/oy+ca8xtuF6NJlHp6pRVWQ==","shasum":"78a935e337b4b7c4a37aa69c1094838711f96ee1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.2.tgz","fileCount":8,"unpackedSize":13640,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyk5UCRA9TVsSAnZWagAA6acP/A4RgyBppyIBLuA4nujD\nlfrPqBRcVWEKbWP7v2Kv24bWuuQ/0NfKTcCnRvg07N8v5Q6mQ1hcGzbpqKys\nqUaRJn/3OxI9zLqao4pCqLyGMcNUh/wELeHBaqqRMq3ckOMAmZQ4rcXE2tZ2\ninL3lt9izGC3OKDpNCgylZYoDv5D0/E3JMniBCe8U5cTEIWtaaRboGHq9nIR\nH1m5JqYHcrtTRTsNDxtyGQym6Ito+NBG9jGUKUUHx9TsprISfoKgl8BUUssC\nHSbp8/WwHiejnozK7BsV1FG20+OUJ4nwAcVUfDslmiVm3U7dWy2nMZLijnxL\nL7BLF1JjhLme8EuKoGp9j0Ylh95P5LercyAbQ5V8moY8ESYizuHEkEBIanxO\nLckYCoxep638A6wDbdjQWI3wrrXllEykRBUxxJodxb867HgRSlCXP9k9ZBYg\nBIj6daN1a3cRIjnCJvyFzpHSpj27unmGTReMnKDfRIE9fiDxFFxlIIrXyawa\nG4BXZ8vh5aFb27LimAC86U40XRoYfMjVgk/sGcoAhdYRZoAYmTZ7wz/lMF4g\nOamB/kpB1kE5y0EXAHJ87zJ0FsoL3WjWxC/F5v8KAzfcWbZh/fiwNM3tNaW3\ngfN/RdEfXvD0oKDRBZqJV1FGwPZDKtX/Ik1+N8E5jjxRkGeAXZHce1wfoY/b\nuwSX\r\n=pJc4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD1psFOk1l81YGU+V0BNeczXFPCkZOPnNJXklVBduHEiQIgQHmiU5jUmcTaK3X+cjf08x8JcaTOjtTQ7lq/o2VCq5M="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.2_1573539412077_0.8005646324748827"},"_hasShrinkwrap":false},"0.11.4-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.3+a134020"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a134020f11044f30a28d7edb0fa1da8e62e18fc6","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-16zQ0XtGSvqsoSCZHiuCKA+ZNeXHSScqzCu/6Payip2ECyObyKFrvyf+m/MVn13HJggWxOquLiIVaX84VmBiPQ==","shasum":"a8e715d934390fa559a153bf1971f5860b7a9a51","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.3.tgz","fileCount":8,"unpackedSize":13640,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyk8DCRA9TVsSAnZWagAABMcQAKQL390AtwYI7f4JK6XW\nrbyQnyCJ5ClK5oZSdhozIdPXcrlwFhh60Uexv6Gzuy9XLInPi6c5G7PbMbdl\naO22w1LnbA6kZ0PKG3L7k1cNByo64A8HO/KT3L4GMMA4oJVGFdw6FZXud3gd\nAvzNPG2ezJR79EQhP/ahRJDhDXQW5G/DZkUfvci2uV4pmJwHvq0aEGTa+RsV\nZQPxnH2ivPOLJ4ki+GWxAJ5CUR5bFOSSdiAwdf0I6zorJ3dmxrB/a2+1XhgJ\npTrgcIvKns0XBAWVTv9+xLz27oled0MjTmEf7fC9kh4a3rotztx0tZVx6HZo\nyDfC4b71wkImcA5g7dW2Z3gOiRZtOxRZtBt1sZJusXTTeviaSYx+AlnrXxvD\n4tYjdWLEUsnA1RgIHoLI25TX4DctsjAOhhadDGjv3JFEKnKEjDo5Z+pahGVz\nyV881YNd3qNdFjPo7UO2gbDLaQVtDlm/rqPW90SECWBD1A6zMH2ZhIepsPGj\nO5USTRa8SENOR5DCsP/OFq/Sg/ZS19SDrUYOXebJm1bF87BE2qUACey0XeBp\nwleUSAlu/IHwUETVnQDr3xL32h5x82sP4PXZEx5aM07ADybCc2uSwYBitVY9\nLc1mMnV3Ty+NXAhnnA/NrADg4y6i8NbqTPz1nmQn9rYSvx5PfOQIeQVev1ex\nvMuX\r\n=GP62\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDotnmlpP4EhkQJIpYoQyM7QrAfq/O9E4XPOvcDQkXPQAiBqrEOo3DKZwP0OG6NMvc6JaNE2A9hJTJC8E12iDDS7Lw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.3_1573539587512_0.015430651308649068"},"_hasShrinkwrap":false},"0.11.4-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.4+2b65920"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2b65920e8fa821f5157758ed60550dd6f16d17a9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Jvy0EEVtShqNObW4Npn9mICJe/KyZaiRMsPh5ApdsZI/pOPaWTfEa0MwRAbfX9WjhLcsH8mQPCkjcPQ/mc2MuQ==","shasum":"aa4f30ed4c238a79316221ef21792600d73221ef","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.4.tgz","fileCount":8,"unpackedSize":13640,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdylHYCRA9TVsSAnZWagAAoLoP/RKju0iYYbVjjjWkrsR4\nwjzbhxFJqFSPtkfFEcILHIp0hiFMNuw1BmMBeb3frx+hdxkuqx6382PXdNgI\n88M0PyuZ7XFUHPN+zhks21MzGrriistxR799RTfNcp8G/vOcyxAUHZoYPT1t\nEZk2+BoziCQrb7GMqG4WSA2+AQyYiw6gptUq5Gz0TmtOxqsgp7n5NJiABlSd\ndJkuMKwDGIjdUsdfXo86roZhG3J6S+FsouVqs9F7sJZRBHAXXM3gG/IOau6v\nYE7rzldkJir7a9pMFFJSnPJC2FhnHzsWuo9KllvZOAbhpuEMwbKVQd1ctbNl\nTOfOufkK4f1vMx7S/zyS5Yw665QfUyLby8JYYxliggw8Y+bPtQr6sgzYdK3U\nVaitt3JtT0OhobyG+iwmkAPnPfVROviW/ImQX19dlzm5tsq8IGuWcsgRBsQM\nWVtO50NTWSk6CmtdfRo8MWVjuz4VQ+U513HmTRb8FpSks7UiCOXLH/ptarpy\nQLCYhHMkizCTkuEyAeekwaTA4wbwDXDWG17DkUILVUfE+BBHeWc+gvZP0Onb\nBFszY94UqBKIs4HU3E2NT/p00jYXq0NPxdONh7S/qXk1zP53TTpFmaZeMj5y\nHrJtvFkdKjTHeI6QfwW5SDXzu5q1wQMoMz/2GNSy5gD6RnkbDHEz0+idxWtv\nKUSE\r\n=thvV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDcRkkCA16raFJI7EuibbScaiVJytJlKVhdFkbD4ZOZbAiBQUP17UoZBGbvT8ZAhh1jkUKAiDV7HBJO4QV9LvdQfUg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.4_1573540312158_0.803660594115069"},"_hasShrinkwrap":false},"0.11.4-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.5+5fc8620"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5fc86201ed6ce8c3a13330d2913d9ac4d6d92b90","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-rAltFLOeVOIvbjbNHW/wmqbkXwO7ZNuOeBg5nOd+KDEcMiZuF98sgd3sVV1zRejqrTFs8WoxxYfpPQrk4JsJ1w==","shasum":"bda34a05af7316b381edb19bd631a87a19525453","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.5.tgz","fileCount":8,"unpackedSize":13640,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdylQ3CRA9TVsSAnZWagAAp8IQAI+kt34IJO58tYFX3aam\nu8MJsuNcelQ2h94UVShdnfYRFs7r7hnceYqJs7q5MsyG0NJI/BUYfV5AYkq8\nNa/jMHFZzMA9oTPJPP7Uiu5d6y7kIoGAMUQALjmwZ8/hZvrYefP/rIWUYshT\nQGHjWG4jgNd7ZPxBy/hhYYWHnmuBaak4po17gL7mlL2zqorzyjr4dizc8YqM\n5Q/iKwIFeJOedHq4mAuE2+Ap6898aMYlqZQY0/vZCikmAk0TmadFHUEUciVc\nYkga9KMdjGbJGycQvXlwzLKR6XxyGRglDLAqU/VBzfrB0zLR5HspsMmGqwhf\nN5OXWU4YX2GlNFKorjE9vi//b4pfGSCmF6/WQHdVP2xcWu1WLDdB8PLlnBaE\nE3+/Jsid3czfcLUnhn3cWNbeAOq9gzSjdFpcGjVIPmqzuK6wGtD3yac7wiSw\naqgSL74b4FGcq2awB6+zXRJqrqneIvyA7lkKocdfB5Kp+NyZmHwVto/FtofO\nAhjkgCln6ou3Vyazz1RDGU+8ZhElATB2p/I3XxALRbUAiaQeZPpe5X8uHj1y\nPC6HV7DOmfHZskfK3Y996CmqSdzahUBYwav/6I4FA3IYnETpJPfCG677WeX2\nF7dexjsjpG29KCbfuDnXPrubN1B1mHUEFgZr+J80TLEqhhTMAWxpwG1oD67t\nA4y4\r\n=PuZs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFE1gjiXe0PDDxT+ovMPfSyD/9ZWYRzL5J2fU4bGev5yAiEAwEnoJz29lkSJsKow+XnwWza/jDWrNskgZn4FlNfDacA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.5_1573540918802_0.4203971954849772"},"_hasShrinkwrap":false},"0.11.4-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.6+1f5d442"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1f5d442aa20e9540e365be79cba223a77d0710a7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Kb1JGeWfpDCf/1c4/U0Bi+96vyS2DRSUTb83tE5IRsQWpUCqrc8fCdA8U8f6v7uYUQC+HbDYR/Bi0yvKPF8sQQ==","shasum":"a0ce781333cb733ebc55af7073774a276b3d5741","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.6.tgz","fileCount":8,"unpackedSize":13640,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdylTdCRA9TVsSAnZWagAAUAgP/0MUi8fKeGRN6d4rJ14f\nDIRT4xaeGUu18a82Fgz0+ibo5LYq5p9/iBATnVcD/bz4X/j3L0LGSSsvZT3e\nlRML1b9PkcVj1flK8V3xVvApXeOhyuIiRsl36tcCbsHhAm8ttKFJOAUFbkzF\nOl8uloyjjlXOsiKnOqtfOLSCVkIhA6LMwg+GAYLRzTYE+kwU9PxdHdCUT6OO\n4P09R+YXVsj2iMZkq6Tjip1PrvBIio5W4+UjbbbtLPKh9ehJxBi7laXCIuif\nwwFB4no5BYHFn6h/m5JTU9aC2JSVT1IpRMIcNF3yD2A+OIfaJaT/77ZgH7Kq\nSn6ZLK3ZF1qrSR/4Myg9lh7JEu9vUK+1/flK1JnHkmwxAt5Q4y92tmTJvcDK\nA9KRa0KEdG5f2E6kIGBmkOfNh6nOhyaqbQsAZ1aQuEQFveoyrMR4bSMWCOEv\nQaHmKs0pCJXlq6ZTNM5jrlOC96WWXu8vDRtoBKEvlimZLwiao6CGEjhMJ/sy\n67bm33KBAj31Qz/JjiWiV+y1CjPswqdNA8AWfKsaFvMbAPD9V4cxBBg1+aS2\nuVz1dp4yhnYNSkMXJPAL/zbxib2yhOHeOrEcNop9PqX+u62xdp3kNSl5Ybxh\n3soUcSuYmFPOvcKLt+iDZ0XlH1fmzA/FV5js8RHsqUUdjXBq5tcdwO5ntCNa\nSEaY\r\n=8hSQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICMONi8idCY69bqI9CHRY3NrNwpbipocyKebHmLgI5UzAiBpqZg+Fdi3+ey040bSeOpzt7dU1E0Zz4YlTDcIX5OVGQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.6_1573541084712_0.6674428443449067"},"_hasShrinkwrap":false},"0.11.4-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.7+4076a4c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4076a4cd52a4e23034dd9739c20bc729f66f7910","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0UeofrZXQIFKsGbTITCJvhCkjVclqB+/wv79g6qBal2bWyT1OI2vEzFYe+HnGFldrzlSgJ23EyHpXeJyUg+LmQ==","shasum":"e4c5b47d7cac367290d97ebbb87c4b970b4f005c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.7.tgz","fileCount":8,"unpackedSize":13640,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdylWxCRA9TVsSAnZWagAAoZsP/3ia7jFAzfXcIPEuXguw\nZoZNl7oyFTGX0mP3AFWEiN9dIPPiSY29CEYqcHpLZTkQBFazi/Fo3Z8kMjYN\neR1PZlsyitooQryRzqr7CHbXeOWIuokmYb7mI9k/JHlq7sOPQzX5saN9wQcb\ndks6WRlrn2FHBDlKnB9omEOIYXe+CPVJdJeMFpHYANP6TjcF+7vGfPxiaZfk\nLf76vkTq4Xh16BSYdRrG6fPWC7+9ZwyQfVvAsWoYf68EmVPse+/iAwjs2u35\nk4VGlYIc+L6YOsoyCXkKvwLmrr1AmV4PP17ZWRlTydhK6jrZh9Ykira09wS3\nnGhYQQQEE74S6yc2bdSUVfnWXUjwOAvU2ROgZe2lrS3WBOdhIa4on6ypAbuy\nv2i3LgbLrXEcMitkHWLQOz7QGBuAAUoYpQNWq//4Mwptw2yuGCunbvtHXwvr\n4WCiQA5YV1ltF0BCf9PaIOA80qgb6H65DUQt5occRITkfO0Jpuw7q+xqJliD\nfOu4OKFjAWyRAxofdroB7Q1OpMhgxpPA7T4iiAJU6Au88jBCINrFgjdk/b5f\nMGJpko8QvObUmmIvKCH7Wbgy7HDYtE8aGPkwqiWwFhm0jbFE14JIACOj87aX\nGaEeGb29nRgeh37ul6jdGBiKNj+B1bVY7gAseAlP88JBoaU3sxttj3/46amD\nsEeH\r\n=SB+l\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDDZ7jUBhcKq9lxJRVLa9aYlEmfSegDwX6SV8p+FYV+tAiAe9C4aKX0wYC8m8RijFNlyihu0FE6Ij9XNO7/WJSIKcA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.7_1573541297507_0.04748270191652071"},"_hasShrinkwrap":false},"0.11.4-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.8+3c80a7d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3c80a7dca80567254f1849f4957524d3e7998ec3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-UQzezXAWOHopzYoDjJYQs6qlc5z0KWyRs85/w8g3TYH9mFdTHAVEH4H0aFW+8JCXCqjqNi1H9rHSV9rXg0Tslw==","shasum":"001288e8062ed145711cda33b848a4c5ef9c5582","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.8.tgz","fileCount":8,"unpackedSize":13640,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdylZFCRA9TVsSAnZWagAANAcP/AnbcFYJEd+k373xbjjR\nPc3+LOYlJrXDn0QJqS4dUy1tjImTIHCGsZ4tJBQe2M4VI8fPibcctddxihhN\nfDL+ymkOEqCdzoWfBNYZtOPciPY7CrHUVuaL1FdhdRlnyQ4F+C+Z/U7K/SUc\nnnn01ljMMaDKZ1Y5KVi5kGN9etqyzdI97y9jc2a6TaQAnvDsWZyHloXKEuQ9\nUZNW9Hf2fvAOqjpUKfOgiDtTzz3HE5V0iaBPuzlcFAZaQI9O1Jynfu69wvqj\nuUQeHf5RYnmG3hA8wkz60I1QBFGD4sjGl1VWFSN9qUKFAx6GvE+XVqGdMHVT\nqrW+G6KQQh/3pRrGjLXQwigS8K7UN8pOef4VWlj8f5XOly2+hwFMONFpLx09\nHJiC75ppHKsZ8st62rN1OOFuWwQZ8YSmMbXFEQHR63Vhl3swnHbPshIRS87C\nfWh7XX9X0+begRZ+2xm5IqQ0gu0H94TCsKiDqIL8A03DqlYtqB3v+/vFoFXU\nakM7lQcfM6QqHNFu1C5gvjnw4sahLS9+P8r+DVyQQgzTgsFSGOqpLSJpmuUZ\nH1tLXW3XnePT+M6ePhgkrFsJCFFgAGDF2P/HrE+rRmDwV79W5cuL+n0eWUxT\nMKaJ3QiEsKeqBUTSCI+bGnhy3H9G9C3xRwsuDGPhLZ+dmXSzXTcCg1wGU9M4\nrYBp\r\n=E112\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCabTkO2m5yR4blxsk0pMlJ5mOwW+6XZEcOpbB32/4beQIhAJ/g2xrhSw321Vah/KdOrrvmgznobc0Ux0mkGSHolH4p"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.8_1573541445014_0.8018520892330894"},"_hasShrinkwrap":false},"0.11.4-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.9+c482cfa"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c482cfac24815d42bd04fc8656c306be5bb71f81","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-hn4pnw0tTzeo4M2UjNCsuPofDqK5OolI5C7cLBUtsCUDe1xW7AV1PKbE5SxclbTCaWCLWfrIWs8YiURzTqhWbg==","shasum":"20f5030b35ebdf5181f32afc6ffcdfdf7206bdd8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.9.tgz","fileCount":8,"unpackedSize":13640,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdylbcCRA9TVsSAnZWagAA2N0QAJUa0ynxpys2ixcAITUP\ndcHzuHEXYQmd1GTJZ20J1iW/7nYD7b9TIq3OyEvLuRouP0JvPPly6eeSZ1at\nCYNCc3l9N3zpS2d/fKlM3yAjJFmrt7AxEDVrkzPOk7bIXFH2Kf8uE1RGjNIW\nca+Gt6YNdDQR1Icwpe+HKgYwgiTeYzJA9yzkeT1bi4r71PrvaB3++3uJLTky\nTtE7Kerk7XG6oXNGrt5pr98msCGrqCyvgo9f2dmZGbTeVmtZkShrokOkc2+g\nEoNkGkjnqvyzcE/0xyGs/u3U/wUPcuwBHDuMt8LBZhOnsbD79HMtQd6sGfze\nW31txo1JNwTDkE64Qzbzws6vUmn4yrooovUU2jRVSiuoChIXKWbZJuOpEg0W\nmEUn5/9wA7mDI/9G/7hfRhewklNHMEGKPc5ZAHzP00mbTuXh1UOsG4k/FWFa\nO3Evq0Yz4zIz6rlupKEif0DX7YQRtzp5t7Eri+eLA+sN0LP4QhgIX08sOK20\nnqmZPc998yRLQht0fqnxgAJE+Uc9TjosMPFWh+ZfqMqqsRru6HFHOng6vo54\nHWV0uflR3twehWnOt2x+eJxBLBnZVZ28nAGbArylSf8EBEBu6Rq0plExLzWS\nK3jjA7xLQGsrPKFBfIreOEOzAoa1P84OJD3+iKWH1hpGSv2VkKsWfJaw4VBN\nGaET\r\n=qT/A\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDzT/GNTxKy1Lj/q7a23cDzA797NswZNR1q4N8yzDOokwIhAIDV+JkV7GAMiym+0vfgC8W8fXf13z0B4ASXG2zk9vEN"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.9_1573541596302_0.11745995997375824"},"_hasShrinkwrap":false},"0.11.4-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.10+afd5e7e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"afd5e7ec9ecf6bbf5a3f6265b5b911c89e324a89","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-KCaAFvTbjcKNcCUB6d6i/3PfdHpUsvG8t56OgOLrXuuUxe/Ez3B8jyexuEc6KaKBQOFMvfjAKvvkrNzawpoe8Q==","shasum":"47c0f583ef988346a4ee04a6da277a5a552c794e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.10.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyle9CRA9TVsSAnZWagAAiVgP/jNSU6gU0WxYZtq8YM9R\nLf/dqrnO2LQXMTHTiUSIKm7bWHPwO509JWg8c49rj2ZdBktsRrBQf9SrtFZm\nr7WeM5YgRmtM4+uKWt0jXtCXSEXVijVyuP+yqDCcMWiINS9UO84Zl3KzSApX\nDwSk1F1Bh6tnDZbNAszbXTwb9cBW/eHTyMDO8Nttu5QokKnV2nuRzkwSVfdW\n9Y2PLOkqZrP9pVJ6NO73n63wWFlGc/fH7QjCeBeAqsfQoZ95fLn/jPktiK4J\ngIC8NEjmvZ/SyI5195stvZ1fE6/ZHbmW6sb4PUuDYFckP552gmCYQb65qU4/\n1rjUFUUNwbd0i5ORx5fAAhUb2/BfAVn9NVX45OhJ7dGQBwG5A6dPPFd901a3\nF88O4bSS5V29w9ikUppRwpPKU2wNv7mBIVW//2aKz4Aff1poL+OaxcfHxDpg\nmWZn2t9FqSOX3gVNtaVQU3pyb2aWypZE31RAeIeUuwZ9sqAvRLlR9WErheIe\nfiudqYvCfxYl597o9RBoB85Y7tdqfLEJrJMWzAtu1ZLnNf5c+Dpqer+zWg9p\nwinBjJ1fEekux9bq3kj5S/7Tx0uNgt2GnF3fVjreE9VmecuO+kEdyBJr6/+3\noNfvWcNQh9oVTPdj3988lfNrIkK6PkKq/KqObx5i9kgeB6TbqgvXwvbiuaTT\n/kqs\r\n=rQCM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDjsEHnU85r7XBQAarTvwliYkEi5nnA36ntpdDUoRlc6gIgWHH9EHcdFG8GWNxYsdkKSRkSuCSGgfTpiKUMZIlhOpw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.10_1573541820593_0.4871664803807383"},"_hasShrinkwrap":false},"0.11.4-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.11+c8e2bdd"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c8e2bdd6fc8003df00e59bed10da62559ce75bf7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ofUBG7/2iF6Cnoh0ec6dMTceqZRPLPQFhd/IHy57WX2sbcF0xmhCBJ3mI942vsHTYx8jRgHM9l4FbIEFEB9c7g==","shasum":"6eaace40eda3dd7f4e1f6792f8085f1fbbe9b32f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.11.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyllHCRA9TVsSAnZWagAAPtUP/03iWAlNZNfbB+tJI9x9\nl/N2Lu0/VcN5H1osyx1kI133Y7jP5QDGyGTsrzvVEIkQ3c893CcHixWKXuGm\n06wmtHkqu4Uov1ai7G0IVslJpGcSi+mgdjrYT0QNxHWVhEl+2M9FoC4FAFW3\nxzPUWo2NJz5Ifv2J0P0C2Sq8+Z/MErpHx4UJGy16w62y3Py4opoejHbiZiWq\nBPthkh5JETWrfHPcw++hiYwtGp+BuwXKLOQcpJ9MtN4CxWAey/AKFoGC3Q9Z\nDHIAk0LwVj63u+I5qxrJcitSVLthih3kOgWZ26S/hWURw8tWzUqFYp9reMlX\nqU4tqWLYdPtM/4O3ZbTJ01fXOOWAihF6KELli4Yo3/MVEdO2yrclawlkwjZ8\nOMpEgdkIktyHdw34oGbmYCiDSrOJJhbo0/qCLbmPVtwWVRaGQWmngtawC/Eg\nshFrQOniUu6w5k09qQaWd7eO/3RI6beRW9RrD4UOaLKU5TFyjN/UInEUE9Sh\n5Mwr2fWT6j9QiChf1DIJuKuz5G9iU6kK3N6jy6x+GWAIriKezL2tZFSk6HRs\n5zh/j+SyhYdnfiw8LPwB1Ll+tYVj5b6M3DGXYKw5y+R+DZhnagpIg6yCiEd+\nQb+xKcvvLX7M5qW2+6P6ixWu53B9wmCncJBFcrb8NJ61ZhTn0jT44RL33nSV\ngmtp\r\n=KS36\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEFX9YnMY/VEa7TPDPauF1jC1ZkvOvqaxPFQUWmrPGiLAiASrPMh2DhH7sMcYgPtgvvbstZBccP7wrOZ9ANsUjBNwQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.11_1573542215174_0.2969765384463299"},"_hasShrinkwrap":false},"0.11.4-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.12+03ceabf"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"03ceabfa839eafa85c702f5f872fd7607bb87293","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4Ofm4dLs/yGwetcuYYlKaJRacVAXGGJWwrqtlx2ARQpb6ABuYNd6taxqt0ckmuu9FGI3e6Yqiud0QY0OTL7ifQ==","shasum":"970e21e66d628ef5f890b39a39c38952d0cd9dfd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.12.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyloACRA9TVsSAnZWagAAXboP/Aw7aI/jpWFHn4ImrPpU\ntnnqN3uMT5ZVB/As4BTliOKJnTPfVt2sj9Evok/YLNJ7wxui+k6NCXNXB09g\nKrHc3CzHw3CYxwia8qIeoysNPqXaLIGUTtzIU3MJNccZTWdYE5yMRrMELowY\ns1nGRYgioGnGm70XgvtjlIPO5t/qxfoOWb2FoUYW2nP2TlHWOS1dIMF27XZZ\nu6rpDbNYC125ctNIqoYJakro5s4Xwcj2ZLjvNyVKj6asSriuZdRM0eyeXcEJ\nF+b3JIZTxz/6YctLRNgfkd+VYOwT22mNjcq9VKwV7DA1WWRiyMQoXT/rKq5Y\nHm5TnJpJ7rJTIXJtAUkLftIW6lP4y/+QXxTPnu5H5jZJ/2sUYs4tKq1XKzsy\n8ciJN0T6dMtNiKPl7jX2q+Ky7OHgpG4cYZsYe7RABd7jy8FyFaWdhBdgIQUB\nwFPJqLqPvrKssX6Ga3Rz4pey/bmh+rflHmLxfSe+P5ckdfhqcDJwnPnEtY2o\njIkz/yqaxvOaePs7in1zN/8w20oLaoh9t063m92d+LyNTmj4L2jnbz09+Vjr\nsSby1gScc0jvs3a+GUqpI1xOXRBNE4q+095HXvOgJWMFACIgcAMMWuO3eawa\nAkb933DoVdBjvArBaZ37VKCS9JtZPMDIi2UjPpWCU1W/JLy07yz924oLao7G\nag9S\r\n=/hEP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDUfzHBBFwTlKGxjAdvD2XqNgK+pzTpKvE3FW+MgO/s6gIgIJ5IGVaQfFddaDdPafJXhDsoVAonjCXxjuBzIbVa08s="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.12_1573542400207_0.5493204699281085"},"_hasShrinkwrap":false},"0.11.4-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.13+9c0425b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9c0425bdb40764cd2cad9ae41253f57433b265be","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-+Dqejsi8ZxyNW610jGcYbHV+12WPisqnIBMk5CE2/VpsV4QHns/9cnVSummAiGsRMMAGdLlpQCCKw+ut8H78fA==","shasum":"1ac9ed42444a373934b217e624519a78e2199dea","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.13.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdylpOCRA9TVsSAnZWagAAPA4P/3XjF4Wp8v1aS2jW8auZ\n1w5xA0iYatgqpGXMQIUvdOmqAGPGmp4sIWIIE+xnC8i2rjtzt4dJbeLZ3LJa\nIMIEF1uiJs6F+7FGOwob9XffMI7U4lxLmiVPxUMeyNyW4kQGnC+Q8XMCC96N\n4hROfNrlzHlsGxOvPP/ewZ3LIV0tXPIAGkk/m3a1+SXegcD2QEdlVI2v8P2O\nmRWstHo2vrLkiQsZIYLDP8brjjOYGVwSl11G3W6E5TuKSSnFTXZ5LWM7EDsU\nGwXhQTLVW+bWPB0+ORsdoK+qjg8Djk7sXzqzgEqC2gAB6YixhsCi9B6XbMx/\n7SDbZ/zHqvuNbCnQNFTy7o12cOKUVK3CuKk0jU4lLviAOgu5KzqUWPpxbJbq\nKuTXL1oX28Xe/GwOGpfqqfpTdDBMNqax1HNIyfIdfiFrqP75tySmTlOF7B1V\nLc6WqdQAFt1xOaN8Ni6XNbeF0FEtEEGC0RBgDoLdgXlmIVEdJ8ZHzXZ7UkuH\nCdOnt5QIzgvsSlRBOijTLSUdKumeimlkRo+lhjthC3DlFinzWbh2QH0LiC74\n6yvw7enLdhKVAXlccIvX2D61PIETXPcSNgB5b4Vcj1Z1sSV6MxFp19xIXEc2\nhP/nhVr6J0EjpnaNEbbds7BcuH4I+4UA5FRw6CGjLX56fVqiRdNlJ6on/sVl\nsFUj\r\n=EZDH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDA857ROedb+xcGX5cnKYat2DJposrSoGL5aBf+1crZTAIhAOUP0i4O6imYkAgf6WVTXL1vWmILiChu64MqO3y99Gdl"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.13_1573542478105_0.48155285673388026"},"_hasShrinkwrap":false},"0.11.4-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.14+59795b9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"59795b91746b83963abfb6d8bbca187953e82359","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-AzqkwBlAE2HiaEv0t/UkA6PR1h2WqvdP+RzfLo/b1b6GcVmvBLF7zRaAWWL+wRAofydFwsJ+JsHJyjJZaMr6nQ==","shasum":"1607c54c4cd9b5c55508fa90c06c2e97bc3db967","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.14.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyltsCRA9TVsSAnZWagAAB9oP/34dEhRxGtTERDLD3wh9\nbxJPx9h291HVdgsZiINOcFDofL1ooQqGsWjBvE/O9MU9foidB+TnNaiK8ygY\ndwqeOQqhrmCDPzc7ETRh0LesfMiB1n/Fb1DmzKVKCyTFx9RDUjaBqSLyUHs2\npaU5ehRoZ04DRcnHZKJF8URxfwlvqdckDfOnwSq8/OKdJM1VhN+kAbgnj1yE\neAGNG31EN8Hq15yC0o2fKohctAK60xy4XfauYnoV7XtXRiwexzj4E3m2hDrd\n2Qri8yzsc8gSnFZS5QdDeHg0x3rWLZD7ebLhZoqF/Yzu5rM7L7nhH7eyosi0\nOD8NRSYd8z028Eq2UxjSUgg77O9FbmwFUVJ1J44qCBFgDQUYB8WEvgYtAdOo\n0iEwwYmyBebzXlmIG0Xwy9rlfp7PRrfS50+S5yYeE7NUOrBtpaNPbTSc2b/c\nh+EjcCWWcOc62Rqv4c/+QxSHaJPK5c8kO9iGP/OuTV/TsNXRLVNTx4u4k953\n7leLMxhC4DsB8kqPydWprsrzhJg54o+7hKnGUfma4ov4xWiRyzPIB1ViruWU\nVChzHJJU0sJsszYWbdS9PO82F9x36Py5fNaYD4Ibmjt5uoMJylH5bZCflBcJ\nDPdSlrBTydWYE8RIWbxtlMmi5ZWZ6js4RCzg1Ogyq87rNtiEzCgZBN0Xu1II\nvM0O\r\n=xCMf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDJ4+6mC5vS24gTcVbGs6hOhz9lYPn4E/d4xHAZUmH7kgIgTV9twZeh8zxsnY1aW2sh7Yn7CG7PnBfV8KeMIXkyCz4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.14_1573542764035_0.9633239295757934"},"_hasShrinkwrap":false},"0.11.4-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.15+826fb7a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"826fb7a9a03196bd902ea6f692c22e34b479e32b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/jZkn0DM5PfqstfZ9FvE1JQfkgOimKszOXwDivDfk64+lttIOtaTY+MKXG3tTPLAaAEJoRZ5cN2pv3MKhxYT4Q==","shasum":"b255ffbc48fb2af7eb5799c2b1b611d6e2e3be07","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.15.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdylxbCRA9TVsSAnZWagAA+e0P/2qp/uRHQr1mMPoeBbN+\nHPMoOA98MGy4Z6yCrsNjoo1d7TGl0HJx2RNVNcoZBLwGLoVjudmk0XZGJ4pe\nxoA17lSnmByHQzHgTIDoxOLhWuuRyWzU77hqTAYuVvl2NiFlg1aodoz9dmrl\nBg9yMd+xuvRtX5w4LGcv3lGr7svUBtH5AtGwOinikWTzDIs7U9AfdylXUFiQ\nkFjm8jvbtco7zFo8Nvwc8ulOHA6ObgmkIoEi2s6McqG4CawwryKMhHNVw2Lt\nEI7HYcx/G4P7nZ/FBUlYevBvrsh6g33yZX9MSJpIhLsoDITFeoRjdxwXpvAg\nV2SJ69T2jG7mjvZLiOLWYVoRFJukrlm0wTL5pA8ApN+Fjelhu7q55kakYwzx\neUnFmhTPO7lMI43RS/fUtS8F6i2sU9yN5Wn8re5CfkymSyFiVrZm+71fBF0+\nPfsqT+0MIOOhcH0dq2gUe2Mmh9adOtXV5QmNSxjnEOyPhevCNp2Rjmkw7Kvo\nkbf18osqu6FTMVER3XuWOQCy4/mZ0wvSodWvvv8ucAoV3Ha+9kb7aEBgRA4I\nmWbGE8XAm8m2/Qf6XSu4npSRWJVAfxGestte0M6w7tqpgJREZs6kYJLchkx6\nJ06+TmaIJ8x1mRw9F2i7e3CZ1VivLCy3VX9qqyy6/KiX9wInwn2mEC9Bcoc7\njg4q\r\n=gffr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICaawWye6UDwH0M2+h/2LCTQmtAflys+c09GB97LpV/EAiB9oOc8cm+t9rsPknu3j5ey3JNv0CMagIr3xwbYsbee0g=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.15_1573543003199_0.49439381866457266"},"_hasShrinkwrap":false},"0.11.4-alpha.16":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.16+bbbf8f0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"bbbf8f0115e77e89b8ebe3ae1393369aed1f1258","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.16","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-7WqFGGqwm7Pi0A19gNhHqfyL0Hfibq5c07Lx0jTbcg2zQQveb+8Zgt1ngbgzMCYvu4iuKmPmNwvR+Qn+ZpRKaw==","shasum":"3b74730ac68347a6b33f6c7c79126cb87533ca27","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.16.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyl0QCRA9TVsSAnZWagAAbcIQAIhQISG5136ZJQlXV52P\nQNwGrl/c/lvISnTicjjMH7+hYiMQ9RRMp5MB3Sl/OFInL63fVPs8dRm0nFm6\nWuxl4ahJYd7stEsNsDEb5W7ftF+JZU87jQGUzOKdWdhV3BGtsCuG6azx9mIT\nnYOcEPBYcMA/QuQ5Xz0uV29rUYA8niUwIWlGnEXyYbSce2NjM1Ii5fB3tMnj\nRt1OYu8jxNiyR8EQTGYYFjeH5aTpKMqeH32PLLd66X4IPmz6H/5M0nsckaXh\nG2433TQNY2jhGsRpZhVkk2x8o7La4npBhqHkGM/xz9yAfO4kFdEeLkY8oGej\nVTlzlhWmRCnBcvTAONdBbCPDn+X+VBYbTvVD1bymNpdw24Kp0EHIkuVVv6k4\ngikSXNntA3mcjeBUgy0Li4vJ7e0XgG1OVNRcIq9yKUFWB81lom7LeLihk5nI\nkU8wRQFLHphewVpUTXtfP+qNt6SEbSJSFhR2Hig5ozSqyMb7OYupDU/uqltp\nBZgVSgl1ysIlwn//k5h3vJ1HvV1M+IX9RpWbjuCSEMITqMASdZml9PF0ZnWN\nVtkyh3xdXAuEb5gX7+6Cwof4d7Q3HUyL3K/xOgAed4aPtZZI7Le7l13tdxQw\nLoqqElQebh+fT2QiU+p0og7S3enNy+yk73yVRoeV4RZE8RHwke25eaLVPrqM\ndshQ\r\n=3+Vf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDofR0DCx6ak4avHVG+3imSMq5A8sJzEB0ovtL3LJXLWQIgLmxHbNUoeO5GIQAybLx3XzolnOqHsc7O+xqagOe7C5o="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.16_1573543183905_0.9531448877829589"},"_hasShrinkwrap":false},"0.11.4-alpha.17":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.17+04c323e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"04c323e081445a3b392e4601511bd248caef01f8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.17","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-8ODNkmIZb73FK7DdmAAg3akek6tXZrjnxI795I2XHW0IVzx5CxumqmEOPRyMWzd4Jtmf7xtlKiptUQKMxfZpYQ==","shasum":"5216eb072300af849118721080848e074560fd7f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.17.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyl5oCRA9TVsSAnZWagAAdBcP/jR7eASCwgHDNcmupH+r\nHDAlSib/Hz18CJwlBoBkavU4bkLWM7h5jqjVdvWn49CznyitNMR6y0hXsMb2\nQqHU7QwT8dtcvEpXhyiCKRbNekPYk29arP5wMRfMVwZmh5CLTgyza4Nw+wha\n1dnD8MbICjWZd82uUftQnk5MhGcg26u3QvRccYSRdvV/f+7dbQHA38OFhf84\nd4KacLuNNZ2NEII+PFtViLRjqh8jPsTfLnd6CCiQ9m2ihcDVN4pax/E8cNVU\nGJqrfINA+fX5nqeX6UWEl/wDGIgs0nrgjYXK57SAGjSVte4NTnx/2b5VfG0f\neRCd9YDW9KkGIBEC0qkY3wfyI43W+ZvaiAS9pVhOUTJI2h2eUbGD7rvQN0Bj\nHnlaR+nzNOpvpqJp/9pOLvhExuF4NjeWK3pqZe6E7DwsBXrOiusBtAP7BbA2\naV/LdAkh71mTzTzuem82xT8Oh2ZYMndzip5EWRYjLchLXN40byrdqYoSWLyI\nNDZs3cX19oIYridtYe62NoPycnRyJwZlLjdfOU2S/93TODNdQI2lv28I3L6T\nC3aGpS0O0zXXPlzllQ9gu6O1WJ2zdqjEow3Z7yUGBOqBQXiiEg2dqVU1DgFJ\nuYzccwGLtiGACDogPhTMEUhhTCXPCaYM7IP5eRXyjRDzju30pE/35/fLhGBk\nU9ZE\r\n=MkEf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCERQgyR8pjvHiXOXpmZ+Oj/9t4VB+ImlT+1nEC67QlVwIgaud0JpT2vzUawueUjXqO7ORGIE3I31U7IeV3YCTm3fc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.17_1573543527577_0.8213228137747095"},"_hasShrinkwrap":false},"0.11.4-alpha.18":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.18+0d8558c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0d8558cf1d813c4d2801ec01a8aff7075e655c87","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.18","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-wMr/DimTC4ocpZE/+PpPg7HVor3h+a+PvUkF3c66DdS22B8UUPb0ugukEV47xoSTjiuPvWc0yhXJt9oncZlu1A==","shasum":"efbe76de7b53375a1c4c1af9d9e9fbd185f966ee","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.18.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyl97CRA9TVsSAnZWagAAfdkP/R6E22y+qWt96lePmf0o\nGFoEv1iI1W1dpTZA3H47PGcYQC/olGsc+oKPlgBVVH3s1da/8BmjJaSujAUq\nDska27Ol9LEgTLaVFPuvslD8rNuyqWqXyWrsfyRyfJaKzavzraSM9e3OSQom\nhQVtNKRMREpESpwPOocwXB4GvdeScg8C6xTI+EBQaZutEEvFHTMxEic06PRp\nk3/t2NcALrXWedm3lqrZFHj/ZEnhCz7RdUMlhk1c9ocxCPhCmJZjKJMr8hiX\n+KndoNBs2mdNFlQp98vBT8zmhIiUFD1BMRH0Vxu30kNp2/4kZsUNCuDkTbvT\nByNrVIW/qEigdbpK1iOHkGCqhHb9oGzr4PWOi+91jJ+DtjUosdbbymiwgTg3\nK5ZZMRk8o86rKhq+Nk61rCrH1EymP7osKxABxdBIMwI5O3qGYavmhwdirV0t\nWs8NfW93dzszyagKLAsJH3O8rqEUYnFq1hn+Bce3pYYL9/ZkqPZa2BEplGC+\njrfY8t2K6osfwpYahzQAvPiFbNpSDwV2esT0CfpCmC3AYEYTyAXcXMUFqWVe\nVy4rv+N5z3Rdntiu+pdzigTRm9YZYP6js5aXZIOmA6TrAgMUVFNfNf8bxDTR\nqIQxFoZE0/hFmUbJRukhx4NtYhJegP8vn6DvnKdCdMfezZh7/L5eZpCJB6+p\nNPO1\r\n=Igh+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD4eNxF8FUAIFJoa6CT9TRVqcHSPOupkjpaj3qIx4ruqwIgblV46n0t5a5jDSUWHFdSE1/EATItb0P9Vxnm8kfd/7s="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.18_1573543802917_0.48293394977007154"},"_hasShrinkwrap":false},"0.11.4-alpha.19":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.19+65faa73"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"65faa732548fc247bb20be0b0253366b155aa684","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.19","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-RQDjhxw/8gbE2cdiM/SLajIPbrmIj8+RmLZJipmzImQaWSGofZln1i2Ik3BaGSgs6QZ6rJI6UKpdicfKmlkgBA==","shasum":"0836ef8719abeeb6e8f0da28245666bdcfa1c769","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.19.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdyl/9CRA9TVsSAnZWagAA/poQAIAJWYsOrj0KpdUj+2ov\nJ6idCjOdl3bO0iVw8HNIjft3/gyGrgaFMD/J9ekzDgZKjzlAEtIIa6SQf7sb\niB00un5rsaTw+WFBzAZRaG4uHEuwSyyDSEtkSiRwu/hKpWnITosdkq1YvAAb\ndgK/qVG8EkUUT2WcJKaxwPACyWh797jIueRw9mGcrlxYhMt2q3iuVdjwoZt3\n2rMGArUDpHFfipaqO8MB2/zzVhPRlaJzRWmxxM6OC1bZft4Kh6ybxPgtkAzc\nWNUDYhc3/XbIM4drbC1d5RzyCNjcTi1Wf344CXqZ+pbtdWosf2EsX14HNZgF\nifG/HQI4dW21CBLq+Y9c++9X8qFPynzENxCcBRiCLKNe662ybpGFKAyah2ZP\njIiA+cK7dfh4OaE+HgOBVKKDf7oSv+Zq/cKyLCa1RU+/u0Mpfrt38RYX3jOB\nC+NgWAI82NW7/pNeXSL02mJIkVjJfbM5voyvqDbHzdSWskpODLTVsOTVT6z6\nQB3spZuGypgYpt1ebhR13sSTFNhTEW0xo2oknPanIOaS8wrRaCEuzyQT+9bU\nhTmX+Cpypf3WQ7gnSnMIUXo/B5hzLJpAzd36l4H1tos4PigGI8WrPzt0pm5i\nd1CMSqj3fwjnyRTXP579chTLhm5YtvFp1bUo+O1QvDy2twh3bcQnxaSvK53B\nGfiA\r\n=5OpK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD4jD14oD/VGpvwtZFNGN50b8/tn3vC05GRD0W79VclRAIhAJS6q00UN4PmlQkvUSa/Q91HfcvZteiF3cfBnRl5yKFY"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.19_1573543932986_0.2558326742077688"},"_hasShrinkwrap":false},"0.11.4-alpha.20":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.20+21b4c9f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"21b4c9fe524596f9f14daf441cf6e599a0684660","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.20","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ds0epTwgLABthp9mVnxYyysFotZHxRZkLG9bIyW8iWSKwd2dJZHfTduCbeQXV6PxpLv2v1X77iWNxEXI0byuXQ==","shasum":"d7baf2ac79cf2abb2912b8a490ac1a87da127054","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.20.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdymDtCRA9TVsSAnZWagAAa28P/iYvQN2zQ3Oe1JvQbIfk\n5IxVjJGBmqsdSrobEXTLQ9UZT8kyGZwEFTzwU3DOLDpo12RK3nGSLVoixZtb\nvTCcFQdSj0zXpr48yMvIre8ch/1xphTnlZjd0ED7z2bt2MO6bAw5Hd9pU++R\nNQ9Bt21FOVdQGLTDEyuBHzP+aIMwl3Csqv/6fef0t3qVdbzkL2VBt4t2XoX0\ni+KXACk4eklQIP5aFxOxsoKH/j0mLce6vh0GXwAl9fiNqc02Geqd6T5ZlM3b\nGRlSCLXssBWdahq1XHJLGiFV9hQaOwWp5ifDnfwr156YsQdOqLjEmVKCzJj5\nYCmqIdUf6LGZJIurc5rFEZxMYizXCt822FDyGKJcFvpI/P8XbnxD3B+rlNun\n4Jvk2RbmqKqQRsDq5ikcFT18tWrwY+i5yyplxUnJPl9gAq5SO+NtYxkvGSYE\n+ZvvcAydFvhl7L1rCi5ZtVMxp9autMuamyouGwcyUatRcgZNCsrKMn8wHKJz\nM8ibhVnFAKW+evMbJr0AkV2z5N1hVZ2+6QPs+9d8SmTMz+Ok261INSsQqfdg\nhU5PTF0j4w9n6GX1T2MMssBu9UkpqDRGtfrwZn9bCKzuzUo/QEbPYG7okVA6\nEkpAg68NwGBp+89udg0I5/gt3EdXQr5nN2NVhswBlQzKwOhT5bzBP83QbReD\n0S7e\r\n=wgiR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEHgdZbwTcrMWN4ZpXXQOVcpyyB1jqeuXWZ8ZMfCH2OSAiEAl2peWa45Ys2EfDvvjcZ1tAkuz6fMUb1wSZx0Sv/z7AY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.20_1573544173479_0.8025661351656586"},"_hasShrinkwrap":false},"0.11.4-alpha.21":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.21+da7dcae"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"da7dcae4dbbf1e15984293fa46431dfb9ba39a66","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.21","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Dtf2KnMN/R1vODIfcJK4l408Nutk0lQHmwGYamyoZEC4OHy4zbWl3rsEocmD+3NwdFNRY0ACy5OsSzdYQBH9nw==","shasum":"646c7c24a1bcc15531621805d88e5f55740216a9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.21.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdymFxCRA9TVsSAnZWagAAUGQP/RjEoWaDHM1ZGtbIMUl/\nDCfLsOpXgkmljUuceJa32u3DXKGlWD2CBHzVZgpwkOniHeunPfhS+dWGbMwj\nCRRaXWWyx/eYbl2nVS6abnIVbc8rlWHS5tN0F6yL87pm2d1dihaLkECF5YDv\nFVVkVvuD4uXhvAH2OJ9ZTgWSfhGg7PALtunAUOsRimOF6C9DLfPpvhIBhhet\nFaKfRGoxnUUiKc0WsISyVbAolFGBdIxxwz1lh0njyD2HoyTd5SqsDwcEFyte\nV0OZ1NkrAItcyS6e+ulCOjuVdRhXm7PGSFsbHvieopiquO75t/2SPsYNF0pB\n3NjwAJ/W3FEXaE0x8vMh9X9z2hI/uiaTb8Bj5Yxb2zKKaih3irMbk+Jy5LUQ\nF6FsxY20q3H7omirVrlu3t/RZxOeI00/W4C0e20bckg3FQvUt917kcNq5Zg9\nAb1eqpkUj+mG1262OEZhMGmUZifJmKH1IFvQf3oXoPrNZ2HlImimCIMOyEMj\nYg2nCfNSw7cXtK4bFDzv48WppBVj9jMfMRBc+14U5ngCAJQ+hlGktDMPPbFR\n+BFY+m9bFfJV31xshmb8vw05cOX5+IUkcPQM2XgjUkX4ykJBxoR8BBg7eqOG\nwPd9Rz6Vtt6basysyRUaIYuetczWBD/1Dl9sQAstHIBABxFiCeiz85t9/t4h\nL37h\r\n=tqpp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDrCAC13Rb4LfDvuTYxQaq4S8IZGVMdk+RFHqJsqCOXfAIhAIovLqpzEddPlEZltz4J3G6/MroFXvFtxh4LnUPbQzCv"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.21_1573544305490_0.4656910688109792"},"_hasShrinkwrap":false},"0.11.4-alpha.22":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.22+f376142"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f3761424dab13d4df8203de4ca4b1a94952b0e0b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.22","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-dXo5DMDK1FLSD3VCno+lH6qkCmfOng9nK0AR/Ivi0PVBo3BAEA1Mrsdyy3ct3/cC6MXZA4bKT9q52Wsd4K7HYA==","shasum":"d4251842781a42f1aa07f55c7d9031576029de3d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.22.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdymVQCRA9TVsSAnZWagAArYUP/0Loz64lUqjDDnu1uH34\nVaOomLPEGMLBKE85mziV+dSKuuR7RVGBdFnaQ5jYzp7zahoXLI7SKPf0vO4k\n8KMCz55tsi7lPFxl/Y56b/dHDgd3MEnhgdSq9TBWQr26ITdvpAQJZ6z79ZXS\ngsA7QCbGoZ6NqO+OB0gCnSi4vZUm8VAUyLlEQG80qjNcwm+QHGWjv8LhK87R\nqnsnJ5odOPeUylUfZ4I7CU7RQ96DuYftRN1t7kUhf/0Mof92dIABRHLKtdq8\nrh0hbr7E+zN5QNtEfA4UlI039xYMT8lPLY4nchKl3RBP5enLgdU2EcpTbJ3D\n7hlujxC+qhrZb2JrTk5rNslqFzosvyDkwgtpwmmwE5xsPA13Th3biTIsWW9P\n4aVvATsfU2SU6SB4JAD2wZtECxkj/LZakt8QbB0UNp+n2apEDvJTuaTqoB7A\ndTxMPOpTZ2KECqxwOwbMLXbXQHXctCHHMduJrporNcFfB72/VldIgllyow/U\nE/8hHIrd7j9LBYftmJzZ2/ApRCfzv2PZf50ZyCBwCW393x7k+s5gHgKJUf6x\nHg77bBL8AY2ZDsvqHlUiQPeZ8I3tqumj5Vv1KbsC7kI6+q1bcKE6zh0QeznX\n3ykNCzCOr91TalQ79bo8ZtvwoQWJDm3tW31JoUQlIQzlNBFfAdZ3XzFW+X9/\nosvR\r\n=a02W\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDYYBeIU3r/ol7Xb9Tls6Rzt5jsIQlMD1BKCt+gqj/n+QIgDaeMmFQF8zp3w8tCCEsPtUVj4+lPknBIoznR75aUokI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.22_1573545295937_0.18568894394081048"},"_hasShrinkwrap":false},"0.11.4-alpha.23":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.23","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.23+0a005aa"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0a005aa799d1ef01b81a13f2629ca2574e57bd48","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.23","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-g6PWpBBtTwVdSAbabE0xVneDrS6iCNLtHKjHO4Eu/hp9OibsY4uBD3LCZDDvzmnfVP2szOldGu7IV1pyp/L6yg==","shasum":"1668b4828e964be16247ca513464c8cd25eb3d53","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.23.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdymW9CRA9TVsSAnZWagAADDEQAI6+ftHiU+C9UKzZWVdT\netqXGBiu0TO0X/G+k4cqPNcui9WsO5+kkOf17h4d8vsXMEiVAvnv8cQbrP4T\nZjWPfGn0YBNLhG8t74GapPh0Wg51cO2Muzlq2ukJhMlzzCsvQfUDozdR2tr3\nzd6TZTBJE0mciTtVK0sUkkPYGI/J7H8BWzlkvdIExA5OweNP4FmJVie9jzSY\n28bIXZZQ+J3XGrxGP5OZCD3D3kjFuuG6j8xF4XLSqGN64MWMI209x3yUjZzk\nrBTgh4yakqDTQYwFq5KAYrxF3g98/ASMCuMt76m0k+QgchdH2TxGrXc2XGt4\nFSP2JltNOFSHkg4x/hasU8D8bPX1WgJzZuNDLUHsNuf2qXeWzd1noh0AVsSF\nvAKda3HOJKh6jLbmIPw8A5gmHnAe0mO59VmS6u3EKmZ87MEWf7oCcq9o0GiW\nKa3o77L9zobg3RKjcGQ096AYqNK6vM3/qQZlC99Y1acDqKTwCgqGvUCH6dOC\nTu96EvTX/6P6NteAReasA2VssRYalHdh06BWM02fgw72yeeRPPtGUISfItta\nQDYqgbaArJFIUem0CxTDYZoDDWRi0I+s4P0syzxATxHYbMj0zTHQ7dc1ha6Z\n3yUjJ1eyf0IhvhTuFl22gS6sLhx/VfJ9PSMwe4h+sVA5j/E7m2WNkff7w9TQ\nqExM\r\n=+lyp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCbbkogcl26edPtblPZULjkZGfL43om+qZEzvppA0GG5AIhAL/bMRFGe8l5XJ1/8CiEQ4+NZUyD1QjYb0K0agEMSwDH"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.23_1573545405545_0.6403346607690932"},"_hasShrinkwrap":false},"0.11.4-alpha.24":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.24","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.24+e32bf69"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e32bf69119e9d8e59f36f556ab26200844f2de98","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.24","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/T06Xb8vqoBT34lMjeZYwcfYQK26jGt8pQFo8EBAvLBzlneRHi9BHRaeIHJmU/3mtxhV2dQ8OcrynKa08vvEGw==","shasum":"c96476f0ab8e1fcbf29d341dcddeef658ed9dee4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.24.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdymZnCRA9TVsSAnZWagAApQ4P/32TBbFId+rj4dm1RVN+\nkyvx3gdV1Q3DATpCqV1gGfsStOiVmFmhQnhhbR7e5ViMLPK8jtz6DdH1kn4O\nHA4QL/4528CgN2bfFNJQSJNfDH8F2ONtO+/E7FwS6WLR+1u0IpLY2Lw+RyFU\ntuiOubVo1evodsIjYfm1aAoBcGfRxgx1krjSG1xF0WWc09FckmV/WtwPNntm\nwcN43XQL0KzvUoBaAxviL4UlIg59LJbF0MnR3jg7/kpGVWTHChfvOdDnXDNp\nv14NJY8792jY+P6vS/seL3v2VdqtQ43gMPwS3D2/OVdbpNGBTZbbT9n/OblR\nrsCNtQMpQuDCrZBAdWiobW/cvmmjX3D/if/o68HgWHnbMMumgHr4NVPAb5bm\nJ80IRY4JeB1iqdSJgWzWjYIEm8PxwkxeHgUOI5MuY302ZhRYbouF/I32ar17\n3qXz6Xp6fmn+ABlB5shO3oFRGsO+DxzD49UqhOnEIpQ3XeRPL2aJ3M3dMqev\nlOodIHYP03gXgofLUJ17ZG9SJ6Mw1bEOmIhXHgNwTxSHJ7VGdtSNHhUaeoIR\neR9wljOaRQ3Qi0aF8b9R2rSw5q1LGK7yOmQQ9UKiQl+8rdZWNsrczu4PnBIe\ncftHii7GPkCH08V3g/2GW5cnKiABgrG5owkrcnx7AzuAZ4xd/++s9nh0DjgO\nzVHd\r\n=XJ30\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHNH46APvIRE1XIGeY7LK+3LmFeBNyl/HWd38oZYyn9CAiEAu4l1gwBFto6BCQPcnyWSVcQZPge9kV6ZCHsa5IjAqdg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.24_1573545574790_0.881279672922533"},"_hasShrinkwrap":false},"0.11.4-alpha.25":{"name":"@react-ssr/nestjs-express","version":"0.11.4-alpha.25","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4-alpha.25+0549f55"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0549f55b891f8ebc7a1339d031d69ce56d4af3af","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- Blazing fast SSR (Server Side Rendering)\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n  Script,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n          <Script />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.4-alpha.25","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-I/mL1YomDT2Ew1FNbUSwrd138A9mpJAqxVUNXxa51HCGfvasBWZOMdgxCwESl2xgXwBR5MNEBLTUx6T6ADiP+w==","shasum":"3cbbc763385ce73fb5730b19f31ad450634434b7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4-alpha.25.tgz","fileCount":8,"unpackedSize":13642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdymkmCRA9TVsSAnZWagAAJBoQAKUa/uYYVxdYdcP8f9T1\nhlvisdjNtclqSJbuloDSiHO6sbt/ZGg/F49DhJpYwKH8w8dhaAUOIDDA6RQW\nRHljogYMMg/NFhgpZJfQkqWMK1F8dzP5Zg8OsRvD5UnQF0iVRq2+p0N0fTBu\ngk9pZ7G7z71wB6AgqLWwqEJ2kGvMQC+FWSIEq8j0YDNel3jz2jQWyri5T8H6\nzv6I99Q2/QjV3ifQhbaXttEPsuOBCkO+59bY51fIuRdv6Dpn2jvFseecubCf\nMV76iIYAvB86QgOO1x6vhJdR7zn37kaa/BiUMHJeiSUzT2J3CQotK+PULglQ\nzFfhMv6jVXeXqaoF5qU5/TbIlIeovGobuc/aIqgWREV67R+hLRb9W++MKkPP\nawlV8EgXG89dzFMNrc23A/szufBRahu5n9taN14Arl2HlfAyjsIp7ghJYlAk\nNGYPUJbr5RKOnA/W5I4ShV7sYHSFiMqzD+BXoJXzBqh5/s6hctx9RbELOq9q\nmT3H+QQI82gqckNzCkHJZCSZhaQ1pISoC60LUVPnxEb0AVWhDKYeEKshYemn\nM/1SwuzBZC6wBp3NjQfKH7EYq3tgiYKso6YtTr8dV7ZekVpyLqCRYFdYHHT7\ndxJOqQ+2rTpDJRhmJyIWnN0hNQ2j6X/Y1bCG/2glaUA3FtXSs32VaOY0n/8y\n0MnP\r\n=6k+d\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICSbvBHUHgEensG1zLcFUN7AQ8fr/igWmLM3jdd+7ztCAiAlzRpKvHevGLqIaieR51RER3hcXwewgSv8bEhFpl8gCw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4-alpha.25_1573546277888_0.2814216621028498"},"_hasShrinkwrap":false},"0.11.4":{"name":"@react-ssr/nestjs-express","version":"0.11.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ec108e8e80294f6fbfd519a52bca1329b7ba5d48","_id":"@react-ssr/nestjs-express@0.11.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mY3MomWAq1CqKLY6VM/XBZBNYfPR1MOTX23aeHz+VPSFuBMZHBJjhF8JTpB/yKljXJShsaH/ffQhu/RXPpBw3A==","shasum":"6d4ebcf497fe9d3a8865fae6e2fa662d15c3b53f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.4.tgz","fileCount":8,"unpackedSize":13590,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdymw7CRA9TVsSAnZWagAAPzwP+QACzc88hE6qq0nBl5F5\n9I4391PhhtDN9h0xqTq38VFrj4ynq0c0qoYxV25UJuHcwGNriUd+lcfIqKhD\nk708EOtx1YBBA0pQGVggS+1m2zkhq9JCKn2jESux2VCW31q//Vfh6DaVJMR0\nCayJA5yKO+QhObt7EiKx/WUPHM0b8Z6wHNtJGK+X7zO9g1oS+gMGbeUES/RI\nQJpE63m71DEc/IHAtYVxe35RvP7LUWPCV1t+EjQlD4IEcUWfxjDNn7qM4dV/\nQO7g2m9U6rW9mDi60ztivoEb1hgViOdVTLmS6y+ClppFpZDM9lw2bLbRb2Xw\noKr5cHyww1xBsS4CzVvLpH61HO12vK6drQeET44gg1fHG9Ws40BMWD1hqhxf\nWhoq5pm6QsJvj2nbfELF0fCDsMsyowJT2906hgE9WpBeXUFagvA7RQfLvy9Q\nY9TzAD2v9qpQvHwFvPiQrLxu36EzWthkMqGMCnahw4nLyL0fS2K1SZ6Q88k7\nZtlhuQjdRCFPU2ODAUMzmU/I7gcrb2D+gou7+lmvd6IWt6Cva8sbd2zDoNVW\nCM8r6MW/HVoXFNFddkUVOikQh7McJH9IasGIki8f389+Wxj5LgWf7cPAnEk4\nLlFugWuWsPuSGy2Dl/msikBdGW0XeDrs40FvSC5qL+01PInttg3bbQN5EbtP\nfcA2\r\n=lXcX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH/zOJDajRQ0VrZY/qnNsHERHi/HvhrIzKYWbRhf1/13AiEA1jXyMSXPLYa4IFht+q3g5mNw3+a9C06WcT4zzd1Jcv8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.4_1573547066638_0.22724643213184903"},"_hasShrinkwrap":false},"0.11.5-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.11.5-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.5-alpha.0+7fdb6ff"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7fdb6ff435eedf613f75a97304a30655ea8893e0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.5-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-9sNrGK5YjFctrQGO50mXE5Nz53wON9iejyFq5E9X0b/kEY57w97VkvwIx/3eT95QLZkMRT3FuYlz5ziSaOLNKA==","shasum":"1deeee8281531d310f583de5c51b394d31f5bc94","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.5-alpha.0.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdy32TCRA9TVsSAnZWagAAHtoQAI7KDlrhAakTx4FHtxii\n9YuHeUdBb0TE+aXubjJVoLWq7DQYNBSEOjE/bvs73alVD6tyAmvOEO6tOBr3\n7kzAYkaaRFpVhxor1dDHawKkqBmuVm2Sb52Jy90Myyb3pf5s0dvn6npzJfMM\nxHMPZ9AQUK6VKVXKzlbXK5VX8/IUA+fihyftlIQK4GjmUZebh24zgftgG+7k\n60xOWSLAYJOWHNf0q7fmiE7TEuxPLmCc3OYUjvBKPQJXa1zuXk3FkSMBVYO3\nHmv1pUd9YW0V8k2wPo/cl4e8X3UPF7YpkfMECBy3m2U+gZMlfPE7suTu2YuJ\n+gQ1lIRjP5grkE0qvtStwhKgrAX5g5BYBVPPqjFz3sRc9ZNxJbgskR3nfRDG\naddxb/7uwjqpzWgO+j/aDsJjiBcpiRaxCFdADnxBq7UBszLLtFolwKwUX/QJ\nFFl/U4AlfE6UuVBg714rHZlxv2YaMghmoK+ubsK+Xk0h1MA1uLFfE2QhAvOz\nOaU3sfBktRnxX2GZd1e2HPrR1+F5pGa5U4ZK8FkHTnGY4SzEELmFq9Jmsayj\nmxX9WXPbDfdE9rrtuHta0/g/eLRQw8Ll590A4BrRISCgkKyJLWBMusBGY9Ey\nuOOPKiT01Wt8KvmBRJ8qx7WS9gaidYwPPYQQZ7Obd+29nTJLrRn4BrEdc/PD\nWvID\r\n=/wPT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEFfSw0s0gJarlynNoVorIxoipdaDbLVi2rEPKzeNYpOAiA4jftDUNBxmvUv79WS6Hh78cNDPTQAgFCvSpYW3jef5A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.5-alpha.0_1573617042915_0.7089954659663145"},"_hasShrinkwrap":false},"0.11.5-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.5-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.5-alpha.1+1434ceb"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1434cebd26db5989bc98111e534bba48b5c34f8e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.5-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-6wq8NRy/mAAmOMEiMx7stZwHCxBkdH7vdhmnlGYfJ57GsQF2dzAZoTiqq0MuKSZGqSHSv6+IMEIXe7cRWAQ4pw==","shasum":"7b7fe683cf77f20f2bd3fa352c1a634ecec3af3e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.5-alpha.1.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdy38aCRA9TVsSAnZWagAAxjgP/2f93aXZymGQ0VNiP+WX\njZJ4qpH2gZzXS7Lq1AHWvpjUrJ19ZxDL+BosYgSHkwC3LIPR08GV//KB69hb\nKifwb/6PFs3ZRRuNVRmtta8TRHnsN5hfCoe/ZHOmWYeIZf11ejxhyaCpzR9G\nDB8KDkzvnnGQ+W3ql6cKdf1zB3RucQiU2IQ8FLfVu76pGBhhP5TDVHdIKMLb\nHq4T21IE3pBCoOvmR3QiSZbETzOXOj3AJx238sclSyvh6o6x/q68FVW7j9lE\nKzqIxviFS/t6s3lDHYmrnh4IMzKGK77eERkYxiGcbh3Eh4GoZmO+IB3E5hB2\nS6EPqt+QdYtzyihW7mJOrpccjhRls4Ti64zcKdfGObhKoR7EJnTkWBHra0nZ\nKBil5CDr0Oax2LwEQPizM6H4Zkt4/c2vzPtuutxMLnGe0CmYp/vw062UTBa/\n8IaEvKG0de3d2pXCRFl4Np+nrDByCUIXDrnZKYooB/p0QGbuSVR9dHOBIDvS\nYO+zo1TohPDN4VYeWFyCjT7RdjugYI9jGFDDasC4RdhPtVcybcytKy5zO6ho\nvNOtOWUByfKuKbHBJzfM4Mibowd+OKu87r30Iauc3k4bZYRe1BleLX4IlBsW\nUM11w+7N84dn7wplSN2HtoD/WiJ2K4pVV2WzAeh5f+BFQE18vUq3IkiY670K\njwxA\r\n=X05a\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIG8A5Ym6O3ApdwWGLtZOz/nujhNFLEMRmXewvtowR8WXAiEAwVzkCmxSvRaMjj/H9bYwVtEUsddUyJE1NJHtySakzhk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.5-alpha.1_1573617433639_0.3915925430840439"},"_hasShrinkwrap":false},"0.11.5-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.5-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.5-alpha.2+cf72b44"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cf72b44966615e554942be0a03a73542fc3fadb3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.5-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-KC0dJLu3YlBS/UsqL4KuE2oZRB0Vo1wcl2nC6BmEw5vdRrdWQxfce38NDHmqch/OQaDyyBwXqfbxbiY7rmAtOA==","shasum":"7d266abe56bdc0016b59e732f2a7f5ad3d4b98e7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.5-alpha.2.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdy3/HCRA9TVsSAnZWagAAPZoP/RR1JNliCp+/N6tz9D6d\noffeXcWKO1GWm47WosFZ+VKnl8hCWsejEG7pH/vAilxRV41PEv1ojA/uR/gB\nOIH5LrvFdHCRab2k8TJ4yj0r4t1mdacZh1UcieoeulERolBYl0JsslTFq1+N\nvdfobyq1voLwjOdXZyiBLnQVh4hyQ8zPFK8aCz32GhReNSuCyeWhLVSHgJ77\nLHDVzdycFxx8SR3rhdpXhgXwP6E8nCHtxQ9inmq1CzqoPG5Ri1Usbk6UTfHe\n0DaKKiM2SYCc0SS9P3SK5KPBw101xgJpW+e9jaqlnxU+yVYqL1lLWKVpkK8D\nd5bFi9Q0NEmbpmVkoJf0WpyqR7ZeH8QHa1LlAgkaXgTyOnc5bwoMsyOZkWxp\ndR5k50jrna2aQHwitjN74klBxSxKpM7xrlBzWzeDhMYnvDvmOA5SbQ+pew94\nZ7NsFDZLAuZY08kXBmzoz/DlFo9e+6axoFydP+wiuThJGUma1LvvANrjdb9E\n1kgpG2AATyA1uirWJuL5lHmu6jMRC334LgmaAWqtMY7t6bBFt3uC8UKNaGPA\nlN1A8fOItWIZgS+LrdfMe7vhYrXpHgojxFrkEOKLWT+MM5k6vhfNikLtVe/7\nkMwuaWlEi7VwA2HLQngMNgI6SmioRO+SbkGLLjW/6FR265byIWzC4fb3AhoM\n775r\r\n=E+VR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHEVZoS/eFlbe4DkKcY39cDQaqmePKMCT1kLpzqokBLtAiEArattJOLTV9hin/Vj/SfVrcrC+g9opmqoOR0irvOGprg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.5-alpha.2_1573617607020_0.24313688445474146"},"_hasShrinkwrap":false},"0.11.5":{"name":"@react-ssr/nestjs-express","version":"0.11.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"eca9a447c87b88262cad17aa143f5e189ce7dd1a","_id":"@react-ssr/nestjs-express@0.11.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-fuAwLD65/sIer2DLDyDhoXR5vxzgukeB0SgTyTQ8aWsV/3GKGzSLP5lClvLpZQ4xsYKzz0STZAsh1LJrfb3/Dg==","shasum":"55a9adf09c6839495c9922abe6595fcb4a701148","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.5.tgz","fileCount":8,"unpackedSize":13590,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdy4GICRA9TVsSAnZWagAA0aMP/1Yt6ZakXLRpK2uVZp3I\nCH1EIF4JYa7u7KHn1adbNesQZWdkMpMXaF/ZJFfK+Yy21lyjQ3wSYoqMfF3c\nfoFx4ko/Cm3V+S7dR6bIlxY79fuiHhJEIoD/i6sMWRtwNl4OG2P9Kx5557Br\nm6+KBo1fQeI5bcWa6bbc1DURsS7OuosgMzJ7MylmQgckwUgdCokvqvN1diRW\nslYjfs1AtuKB2Lqii8Uaoc9xxT4FXCg+eJKGDUGVDmmEuGzfuhtiV8GF7Pnw\nyE3JlfuuGmSiOdz1/D5attymeIlhDKoVEqNtjnmg27rA6/srYYR0+ZnVKOBC\nLkOmXkgAgd5vxZFYboBlazXrmN9kWd08P5F0JnVrbaT37BtvqGv+dQLoHiKJ\nAc/to9ViGNAJcMe08PUYBedK5LKYP9xqD/gU9brULaE9YizE6kC9Jed25JAi\nHRSSI8mQouT66iBqH51cOaLDl02rPWynOydN8kYxRdcSg1IKC8OIf0ELINIk\nVYQXKUcY+1c07zPOWFbAVFbN0lH05QeOTNEwW7Xytw2yyL93AESVF8IsTH5T\nagEcoojvtDixdUHU5J2VeVgWL7pfBjPCpwPJTTfUkw2rtxKjlzx46z7Hr1ts\n2c6g07O+iU+rQ+DhuqQy/qlSWqK4ENSRlVuOkco8m2h8ykUdlrcrOU6d9gFs\n1iHQ\r\n=eJ9H\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQChb1fOK4pm2aILTrBtXQZzy83w7Vxhgb1oJwp5naORwAIhAJMm7FkU9sutpvvg2GsLh5fPlKLIG0ZaNYuCBjUjR0Re"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.5_1573618056228_0.16700152864501439"},"_hasShrinkwrap":false},"0.11.6-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.1+8ec1ad1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8ec1ad144d52edb0ecd9d492c8dc11e7df195e9e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-grbpKD0NcZ2D/76CJVaPXAVfyZ4V1ng0FunHFP9KDWvWdXEQmgBD8F89CnNH/Td/gho9XSMUY79Bxq+Xuy5WSA==","shasum":"7ef05c713b07d0f7e24bf6e03106d7afd0dd3552","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.1.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzPlhCRA9TVsSAnZWagAASeAQAJhpSeNdrklxK/HcT0fP\nzdhkLyp5C940+xYdMJZB0oAPdI2/0jM0TIOGrYJL5qaZRt2hXvpeqjRBFuzN\nu3I9xPZlq85tNXlLDm8DGdzYZbH3CWX6Pr3O+ztyqAMS0eXWXv85LGLluisf\ny5WC08mzuFhEeTnivgiw0mZ5W/u9ux0oOCw1KBqc9qL0BOosIXxTo92yeCAt\nFR0S5wYlGyWcTKu0avDYPAPuK+FxU18vpVKlwNi0GtsquA62hEpOb6fMWvXK\n8kKIH/XwwOwtJXQMFHEGt8nCAoyHvTT6O1XpOTuD7Ry8eqPzZjwNoBs1jNtw\n6u45G2dG4LKXU8JlbzvXEoFh28JbZ7qpTV8GW8706zvGLW7ENl4bnhrDTa7s\nJ9iw74syE7bCJVs2F8qhAqrlswQ6w+LaOOguPSyX2u0WhgCmaLikTXfGjllD\nchSn5eOvBoodXpr6wSqtSbipItrQC8aNNHCGgwLQ4kvUFK82fMQhjPotTnaV\niwf8iYVmFPxOd0YQz8V3ThQ+NqaxeDB16OuuP9ozii1havmp6upenDAVqnjC\nBDakpitznAMLWfdyIB/QGE0VgWNoWdmqOKu3rgzbC2GaVc/O+awoouRDqJKx\ncWJVVCbPfc4wYo7apA4J7SZ3OuS3WOO+JrZfUNO6sxl+Ec2bC/tH0cEzqAO5\nej15\r\n=EK22\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDUWQ2nXBhh+bN2WZA8BGrECs0Or0ndC2D3WEz1g6NdyAIhAPL0g0ITRHYJySwnKL5++dNOK2nSzHmyrxZsA6kv932V"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.1_1573714272567_0.16570444612009205"},"_hasShrinkwrap":false},"0.11.6-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.2+9d133e8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9d133e89bf545eef42c257c5f42a31ab7384f3f1","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/lrf/ATcjLcuYarmlG/2rH9GnccZMpNi2h/eqWLiOwuh92GKLtqIzIcDUeKe3oQNB6hRyfH/PKjd1R3tDE8s1w==","shasum":"c9fcddd6d0592a9d89d3d4c8dd6b4633dd083109","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.2.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzPnvCRA9TVsSAnZWagAA0vwP/0547qX4wztmAP7TKC83\nmJYzYAl0fXQ9ajRwuouy6TL0dPIUltAvjNPEIzQUSRbt7BRfiOJuyDAkoFTq\ntnK0bD/Mk8cngNwP+HJQ4HTvYF603ge9DWVkJKYRrdFZLCtnIlCLPYZGVOJG\nXNUbfJlxmlIpbv2qr3GIH+heGYlU+i3VRAW0xrHH8S571n3VzCriaqc3QT8k\nRVc1ii4gY0WBtYtXKSIqS5xLC2DoBtKBt0T9wa0Icc/7uqjT11Mz3+vA7Csd\nn5BRgL3WiAcxfDuNAyuFr5En/SiS7i4vCNnJsL3j9bPOhmU+lp0d4/zX0OFH\nEAEfDSv7SIA7OPewaktsVuBKBF+w8nn1K/cuPcDmURS62KwA9DClccCJd5bV\nvU2a6wnEOLXW6jnJkb0Xi6/uhr2P0T65x1ocO24TeQMg/QGvGpNt3f23N4R6\ndBeQtOiCpJMV2KY+vFQG4OnHy/tESlr5LCjmh4OpUcZG3mExsm4gG9CZBZMS\n/UsLIhjwJanW6HABEgPAEaVwLoMt4LJWCLk4Wp5RBXC4jQyKwdjD5fptnze7\naT6H47tBSVLsvkC1A4NEirCwJmJ+zgaUkujYq/qNbMePYJ4qNAClROn8dXeh\nHUr1+OYLsrHdBjLBrdoe759sMXf0MhjObQnJRwztZ3pp6OYvlymr9qso5/Vs\nnrOp\r\n=SmTN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFXx3dqSKCtmVrEn0pGLiH2zA5S7cbuTZm/mWyMc51GTAiEApZOjltcBzCjsV6GU42UGdTfC3bZallyjHazXjGb1ECk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.2_1573714415439_0.6982711744955907"},"_hasShrinkwrap":false},"0.11.6-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.3+6936f52"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6936f52b107fecc64bdf35fbdb41bff77fcfd693","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-5vF9YDbdje7zjp3PX6+eVZghvkhgQ6Kft445fqXFA+5PPjxkIIc3ou5Rjkn0jSw8wvWjXlm5+sAkFiyT9Qf5fQ==","shasum":"ca60a1cbc6c9cf89a63ecc442b2dbc2f648dfa53","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.3.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzPtzCRA9TVsSAnZWagAAjCwQAIMdhuI/Siqu6m8YjJiV\nBdJsrqh7DR5pwCi2vFR6PQrGeE/+wH89OkveV7KFjrvrB77KUPUfHdiQjme7\nGDXE8JshfMXl9naNqoYfbl7dD+8+YTRBK71e53RpvXCIae76orXeLINIA20C\nnY/M0Z29W5pZDlNT4aLTdQmwBIPoBGSJDqxHRLNdcgb5wTgoYy8DNYpodUi8\nJjlaLgobFvVQ5q+MAdc18eJd+t1mXUdn2E9SxwlKTyee+BJui1gr/QCYexY6\ng37GTgaONYYvWyJa6HBW/EV9JIgazAAKhJgwAmm6+r3ZGw1pSBTFtZEMxHX1\nVEvvR6y17NClWy8PxA0VRoQx92D4dDUx+eqgvXdoEw2nTPGJpEp2Ke9spdMF\nGT0zMfL8f3Z6IqScKk8zoSTuO1ZJz5ZdDNAgn3L49wVGnGlsrblpv2T5TP/g\nZTRDck+/EMGskOTi3iY9xQ/NdwjgJ/hTV31SuTIcCD7XgUXRadu3fo3oHocE\n7DN6/ML1igyLzdHBdADXoRoiEUfcLCUZV8kmv5bRn995BUw+D749PDX/YekT\nG/kHIp8/+XtnKH8ZhDFCOqKD53p6cti31+MZPseNSKXxgHhjduGHyAfq+nU5\nuCncMyaMe65/KJbxdA3+JBOEkSljPQ+w/GMTUWF8RGOizLNkmpZMXOSsfHna\ngf3E\r\n=t4J6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEbvGNeeXaodp0xXNv/uj6/OWSNwKpTuXm3VWUtZJ4sqAiEAoQRdrW3hKOzZq5tVdtgUvPjkpraSSNxAaiTrnq8sGyY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.3_1573714803067_0.34951204377311784"},"_hasShrinkwrap":false},"0.11.6-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.4+dd2c016"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"dd2c01666a2136029152db9690962b8e27c93f74","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-3EwCfq9uhMAUnwGt4zBGDfGFyfqayW5iH2oBmNRq6vXOmw8qNTZaVx0fQtuV5g4vUK6nwO1ID93HLsbPPpX6Zg==","shasum":"5c4d2e432ab16dff1cb46385d21d2451807f36a8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.4.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzP8JCRA9TVsSAnZWagAAc2IP/2CYzYb0uCk7+STqFH44\nF4VwSI8266PZf7RkJHZXxvbBTtXZTv4xGe/0N+S+RtxqrEQJK1jB3TnZ37U9\nEZWv7PtJt7x6fpVw5xFKFWCBnpgqo7I+LuQ9yD1c1q14iFB7dX6WMmNY4vR6\n7/qmysNVTzyZ9f0tIYF1YwylfWgakaHwcXLgjBBpYIbpHWRGrV7xzRK/+cQs\nCo6ROfZpdmeRxXkkvPWx46LumHwIMLkfDyf8A3hCeNFhe/vmYhL8t2/ieuZO\nM2KnI0/HRnaKvXCNTNMUgFK7IjxGC2ZXNqo//KZjZPSHQMJrYhoBNYfEAZyB\nmBPNT5J+eCQ5ZgBnoiZeyjsTU68jd9awGithz1Su9nXiwpBUwxb4tZX9OEbV\nVY8VByScybHASh5VBTx0FjUseOJoLBw2aKmknsB7FdjKH5BDbnc16av9pYYA\ncCv7xl310lrfMzBMdD4waWmwQh9o6wo9sIalp6+Ph4CuefcYkJuEX11e4Orw\n2fNC+tv1iQcrOOstfRcrtWlO3lf++FR4gXzdrih3kixj4QJ3B5m3lkFKgs0N\n70QSJS7WmBPClf7fYyA2RgGaFAOr+VMoOZwo11tRbZ1yWLzSJDDSUgV5A2hR\ng6hYuKaNTXUnkb908NDOqkqYgiKDPmTQzyGrxH/EynrUH0s25xeIL+V1w/yW\ndpiv\r\n=UuYR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDIQglGoBIUZbel4PtGwVLdRq4uiII76u/XG3/BMfs1MwIhAO/cz92M045r1ZF0Hy8fDOXvPJGDjVMivWI8z1I0G/YE"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.4_1573715721310_0.3506602727200039"},"_hasShrinkwrap":false},"0.11.6-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.5+798bc39"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"798bc390a1b9914ec8c92a590f424e335b24f402","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-LDhRh6oRgn0nkdCyw2pi5tbt1eR9jETZlVGQSBIO1ZuKKMP3NXgNsiFcdivr9FK9hBYy1SijRkRuYOEI22uXRg==","shasum":"809eae0fcb1e2f970aecf813187fc917efee0c39","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.5.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzP9yCRA9TVsSAnZWagAA3hgP/i01wtQGf4QHORSFAKHn\noQzSdZZYIV35p01wGiVDOzX+vq3BW6pSRCBuLnxGZVGTgtdQYmoDDKztROPw\nYIqtCytMDar8zS7plPyuEpmpu4EjHS6dtBNI0EfWx+SEGlfSxK95kgQRA5Mk\n46sRxBU5kG4Kk5g1i5mF/eOTlTsliOlaRk897lj0oDhwDurVqvG7vjchJmRp\nqHFstYikG9ajW+wTN5kfGEI2p3xREDqB57IrtIpEobR1s7S3gSr0sNT2xcyQ\nl6GFSYzN/uIbfaC+OtldERiPgfwJEE16mUdYxx48mtb3MWC7stHu4xq65REw\nG16I+juCzrHk8KHKimbGF26VyotyDh827M5+0Ov3RHzb0FSnDkNze91qE6uO\nBG0RloVziYySWBxZas589lHFSp0ZAqU1f7EaKvRd+hUCleroiUWDjO1uGaFU\n3PwPsKHV9X436lVQQh2YVB3ni4t5QLSv6LkX7z+9j0dD6boistIAaxVpY4M3\ncxPwzC2rFpim0YTObzgb7Gn5sYax8IIMRBkIZR1zoEWvJRbV2ksRjqZfwBiC\nRgfsZJ051XkUszADecsvcr2CLKN3P11+FeLsQiFeHc3RofvXq8V4MjePX4d0\nDoJAUtexfWnH1AavqBBafa7jRZUd0oxSNQd70dbVHt5V7TF3+6IINb8UPpXU\nHti9\r\n=a73e\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGTX9UJA8RrQXDYPLaDcqUTDRI6VPd5PF3Jytqa0ZRouAiEAxsv8Nvat6liBTRg758q3qEhj/HhPNfSJmY+5Wi6zFPE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.5_1573715826132_0.14598373197787362"},"_hasShrinkwrap":false},"0.11.6-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.6+c6670c2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c6670c2842a6d34c271f71e197a354bf8e7361ee","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-FI5THiCowjdYI2/q4uyFDv3j/VbCkIce5gwHRXPrjjoPMbc2pgt363TRuT8HBDJX8iM4aPRH88//cDMxaWLx+Q==","shasum":"bec643ec6c56eabec77b81942622d5f4be9d3fa0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.6.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzP/RCRA9TVsSAnZWagAAdh0QAJVlP0TPuzSGhW4pOKkA\nyfoz5gV0F3zaXK+ycHZ7d5yv2JtNwGidSQZdSKhp0wzDnL5/k01u+XGypnkn\nJPMa8ne5Yej0pThHHXO5PDipKPIlCi0Hz88NJAIRfZHaJBSv/DDm4hHYNLY3\nOJdoFr0PNv/0YKUkYPLNXOB0fEKNXeCKKmycGqOHCWpaHbbe0us7o5QD45r2\nK2fH6acDuOxetEzZp5HpDU5BhH+ojQB031DIP3Dq3pZUy0BsOWEf6Fg1TbTi\nzojjIJEqvh5uekhUMBhqliN2w/TKbNJWiL355fyzeMYwPsnV1lWKlzbpTrw4\n9LwQJy30stBwktrgNyA80rlYePMfqR67GFPNs6tXBTomiFB7qqbh6MOfB66h\nDgjz+P1pTe65a6ZN4AQy0Fse2Sy60jDv8TSkkqcD+yoyno4qEDF8SqbTeofQ\nDhLxJMvJn2laY+vvi+DgThDKI6PXxWqEBDIDAYKfKTSGPvg6JdsFTyFlMFUA\nrkJUo3GBMfkbuL+ftKIhXumDq6uWcROVP7uKv4Sz87DaolyLrI0v8QL4v5f/\nYzaMEGLt59u046E/GAjM7oFgeV56lu3GhBrHz4IxYg07k6apdUV2x6aq5hIH\ndMcg6o4i0Ti52FdgM61EHMtYDAE5GiTLd6eL3BvQS/iCvyXqKdZty/WCJWrU\nRtTl\r\n=QpTb\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDmN7IutPzb2aIhJiz8i+0rcDs2qYp/7qEoEHAdMXWa5AiBSU1aKz9DhY16fXGCcNqWLEaNdAatki/fLhbpGnVmSHQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.6_1573715921278_0.5873005422071551"},"_hasShrinkwrap":false},"0.11.6-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.7+61f60f8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"61f60f81e08c4e8c017d34872e5322a39ed72ec5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-5gpOlxI6C4GEICqosQS8HeDul5ZSe9MeEVPDsAYGoiA/wcflij33xq4i4UBdKIhdrQgFeYtnmEnxs3Ot141FcA==","shasum":"28579a34754ab9140bc0efa075d3ad2c6ab84898","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.7.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQSpCRA9TVsSAnZWagAAQwIP/jLD3Idn1UXhD+I9fQ03\nJc/OVQ+ojAGZOShSHzXO42aNZ7ByAYBDq0G/JTSr3aKvIyYq+b3ufH8gwwwt\nE81AwuSrqQLtdtbRtWPXwGQuOGteFmKW4ddGzoXX5TY5FkWkNlaLteDKDndg\nThwudSTYY6K4/HQRhd7hx/a2TV9I28+AGZ40dfFlKycHlOIQq569qDQx7g8+\nx7csfMlu39LLC8T2OI0Ylo1W2/KQWV4KH/0XVVPCvY02djcZPEmjkhjoeGPg\nGYbwrGeSdAmde+GTBEXdrs2rWWoLUJVnIOi9tmm69tEfqd49FN1zCv/ZFOuj\nQSbmer+us3IbE4FjMXK0wzj06rOl00+OvuWToH3m0HpHd4mnXtU4taY5rMQY\nSScPpfxq5QGsDsMt8MHyo3jJG6oSHHTw0FPSYGX8kJMXTOWIRIQb9bnT2MlH\nfMFbyrOSJq5ITxQCrro8TRaiaMU1fl+RR/NrY7AnbgjgafBs4kvfG4kwGbLN\nhiNlsg/yfEyoirBr1Sy3dFHwRcRwa4Hwd0bakV1muzwPKcd192SRxCuNZrWm\n8RbRLmg9uDXTHCID5Df7uvo2SpQmG3bqpbBHQRWAmmVeZSHZpDhjJmTw0hP0\nTPvrkKqqF3NHF72zikXGrh8rTND66cUEW8y/U98yI1XyfrfmhjsZBR9ZBmuj\nh7ZD\r\n=yp+N\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDFrYFEAa2QeK82cBalx664kds6pjqiGU4yZPNbrOX/hgIhAPoKYgyNxvT2aSud4aSp7hElS+wyal84n8SGxlZNJ6Ln"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.7_1573717161082_0.5695840845955458"},"_hasShrinkwrap":false},"0.11.6-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.8+e9025e4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e9025e42e8463bba34aec250c52fb42d7ae05b7a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cOwzkQDF0at1bvpKJqpInxUudwG6Ce/y/2oD/NRTn59aEo5lcM2hXzdZ4a9yx0KhLb4y9ffAddUYHWjtHIOEeA==","shasum":"f0d33f6d8080d8a4e10762be507bd0240f946f99","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.8.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQUCCRA9TVsSAnZWagAA/9sP/3KBdzPvkm03e1IDuZF6\nYpVvYU8CsFXaHobpiYZ663D+lYbDXwCVYYuhbWgirgzU9u28+T7gLYio9BAu\nnK9iJos2TpMNlokOwgoN7vyrPkbbfESNqjdYR6le8AHKqoWZlgPig/75fhFT\nHGqXkeLvUzFFdEDW8zIDM2YnYLgybiDf46SOn+gVPj9eT8ddBe1zl9wRCLQQ\nLiBUnvX6XVSFCbrdGbAICUhLZy3mZCaHbxt+LwuK/HV4OzH0hWNmzRvngMcT\nJb2paPGN+Xh8Z2zufZdofO4oSKhMkgolEKo29O1F3QRxr66oK8OQ6apLIHDO\nxf6m9ecTLyZVoz10xfoIWjsVTAy7j6FGulrxHinvN0V+jTMSbTPcy6xib98C\n5rNj15f5B6Jf+SihwaLSRiNK7r9Rk2U4PpzYBMU9kSKRRSOgHeNvNRn5tr7E\nypFOyu3gB4HkMOrBIbdNDK1hWFDCkWT/IrZKLOSgfPjaOk6Ndc7JXaJmorI/\nNe3m0bXj8U38hy8d41vPVPrhfuxoWg8Mdq5uv2bB+w6uCWyqEkwlMIMFMk90\nYpLFppQpGBvhX9fLKcuqrnwgvZjoAkUg9WwZ/bOwJXbJ5e/DsSHjkWeLTCIO\nXXgSaUld8PJxePR/8goqc8ucVcutLY9jWHeaqF1Ym0UFV9tWTRN5SgcP42fO\n+pIW\r\n=ekX7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDk2ipuMK2/JijdXlu36uiaHPHxovApn6HmegkK6ZCkmAIgZUS91Muo3JknPFg8mZMj+PrWS3z6sqBVbC5Q8ieznVo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.8_1573717250113_0.9059295047816311"},"_hasShrinkwrap":false},"0.11.6-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.9+7594c38"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7594c38881af44405d2d13787cd1fcba68c9eaef","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-3mLbVeqoYKoUydD7r4J2i6rXF7q1XZZ2XCj3Nhi761KJF+pXTtnUX1Httm6P3Heq4TrriVNvnTsZgttxg8Qu5g==","shasum":"53539b58d2373c454d62523fb9798a2ea6ea7b69","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.9.tgz","fileCount":8,"unpackedSize":13622,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQUuCRA9TVsSAnZWagAAHAcP/0sNICaVGOFXNIbjWyEM\niZXHyE9vyAQj6OOzr9utNOniI8+jP4ZwT2ci2wk8Rw/6HuUIovYrEXSOsAUU\nclMlVw4b6xMR6Zskz7NtnGPukj9eAHFfXXEmdB30rpkObV+I/cre92OYSIFG\nlE3743ZA+ulTws761ObQ/AlSlGlovA0BjJuqtQxu/Ql6jdo6YgWdrlLlsl2q\nIOlShwuSq7GKkgsHclFhEa+W4r/zwNEC4ssV3Y/sOgZXBtT29uISOG7WTLIj\nl5KtGSmyDhmkNislA6lrC6Uzf4pzC98sp1hrf4sal/sLRXBG3buGclyrdYV7\nsTiTepNtK7d/uWSpXktpLAHMWlyQpVUBtmbssOmUlrl/fdOmep6ZEN8lL3Vz\npnE+1Uc7LO8X8SQuTXGPAkQokf5opPVit2ptG86CufZ5W6FmONTI8ksPDUvi\nYEkplyG6NhynlrSk5jnEUGkBT3IWoRoqCcWBY4ZKky7lcj4nWzRHFkLgvHj0\n779IcBbJ8vIi/tWQnHRakghgRBXLyVTJhUr8ryJWxqlKCgW5sw9YTgxeU0dI\nSojuwc8d1swrAjdwfA9lK+ziUfQxyfCbBKB3WysvJarZ7KIZixmDg/Nmz1qo\nzVa2G4cr3VUKWxpOXLdob1eVYpsAH4B7sMpetbbAhP8Vk48IFGeDpIVGCfNK\nw+KS\r\n=sVso\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICaPYdWG9mI6mEKkx9ArLyU6wuGQY75vyocZt8w8yc1nAiEAv3AoAeaz18tRm392CQLP9vnepeWz9RQsF+mOJ/OJGQA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.9_1573717294512_0.9187246389231936"},"_hasShrinkwrap":false},"0.11.6-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.10+dd3df1a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"dd3df1ad821835b5c73c3cc1a6e757e69adbd598","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-xFPZiGOpZVvvPsIYmvoq9X2AQtk+dtuPE3zvw2vh+EAuFOTPUrPP0Or+muo6yTCaLz2MkXZiDkGQRQ8rUcgCYw==","shasum":"2eac4cb62ee0bc02e8cb53f335b474000352fbb8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.10.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQWFCRA9TVsSAnZWagAAkwAP/AwAXg2it+ta0mcJO8jr\nHKe8764rIyCrxkzyN7fYHD0Me3GcqRsZ7rWt8eFMait/S0BkfsbuD0UnERNM\nyPo2VC7gQBE6zbSSXC9Qh6axcqD2HYqhg/BprNmyv6zd43jQKYinWOuDvigz\ns6EtIwteQ/0j83zasCNtsNPOe96R7ii7pn2c0dcqxxGmQAODTy67o4egTzWm\nboJ2nhHfQ52y6L93xV3JGPQoElV722yHpPIxrXsNUGubD1GKg8hoJ0to/AFb\nAPmqV+eWWZVOTGJ+j69PvqDNcoxzfTgJXS2RWpT3dAuqKjgGoHlYlnU2Lsow\nmV8Wq5i37b7ny5rK+/1llzyCb7ZyA4q5khiCl3iVD07NBIOByJVHunP4DCtJ\nmo8WPOwqdjayQd8Spv2Xhj4FgT03q9YPjJ8cpvVNF0k7rBYxNRPFrTRO1zNW\nlXVSP7N8uYhfA6Hwi4W2qcnnesdInKAWcF0hqWvI+XgNDUd5aP6FYWjBF3WC\nKFIs7Sak4JlFx4bWDvmpQRBJlyzC/h5fefjgODyQYM8I9sA5UriSwKHKirLs\nXORLKACUGKe+jvg4N1D5GAF+y7wsU5Zdg5QtRKDqs5bmbhYpt603CDN5GbLJ\naeNAi/qmW2drBi4q+o4QJxnutSY7CNOTTPmflw/+6iSDutiqolZUgS44qNFd\nXlZ4\r\n=ltgt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDEBwvb0OH0B+MD9sNO985tyffrpKIIqyrXsbdolcsSDQIhANpHASI9/hWrfJOfupa4LR2UZEkhTu5miDj1a1HalagO"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.10_1573717381414_0.21327443946809543"},"_hasShrinkwrap":false},"0.11.6-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.11+76c9790"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"76c9790bdab3cc46461af95bba1e720676653888","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-PPQWEDv/0Jl0GszRN5sS66QKzx+Rq9m3R+XybwBdfodOsXdIoGsQsZEy8W35RBRWvpp1lfqoLO2r92Qs/Ec+6A==","shasum":"e554976689d3a120be69e1ebf305d31efeffaffd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.11.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQXcCRA9TVsSAnZWagAApJoP/3UEtBdylEm+zI7gCEhb\n0ZuuYsszVPIcb6oFEDEVXXl+hyuCtkFH5hsQn+Gft/S8u/2whTLs13vqo9aF\nrxpu1Zn8M2ylgpV4NCbkSB/9GKKHr+KwGlV1hhz+GXgsKB2ub7EkCec2lSUd\nqqo+HncaVaxT5Orvc4j6PB8XCMl3/1acFqaBGwB/DymeY3PL888dd/tFPejm\nJDR8VxZ7MrkVjBsQ8mw2U7ZqfUg/7/yL/tUVcw93xTe8qxwSQR4tfSfSgWi8\njk6DTeoJNzgmy7TGEtHDhwZZnt82Ix9uGBohK4pH4wkmPh0jPZZ7n7TVxc2X\n3bN3DSdqu1uuuQt39EZbbwmbVSCNbvLe2iVlhl/uLwVymLmO3iL8sQjtXP/9\n0HSBo5GA2L7POxKU41lkLp5ueGIyMX60kwG2Hpmwl6/NE+caG/5Ic5Um+DWo\nd/xLXojpEZvhrWtkkesnvfox3FvoVBlTq7rI9lvBrJkTLP+vqPVS/j8E10/U\nG5FfML81QKbtAp+6QvZKEKOVkt+/TOg2E768kHronb1oFYEjhT8gInlavLKY\nLx9b6w+ovfzBE+bm455OhWhGUJkgbDWn9Bo+e6jb9f4JuQoZthYOuOLncHVY\no2LiI/lyNW0ohEY5ZQmbOaOq6Un0H3FtD9anpnAWGRbbQJFw87yhIny5PZU+\nefx/\r\n=or6t\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC45P74n9x1yEXmQsBatIr5jCl0UmyXJsx1vpFDMN65OgIgQXARBJKulgc95M+yv5bCLTrZsoI0jEkYQlpcJV//bAg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.11_1573717468215_0.49978263043355664"},"_hasShrinkwrap":false},"0.11.6-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.12+3e31a8f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3e31a8fe5e12b3ed405feb6b2d0bf11bec83968b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-EtHQ39dlGrLdtqOO07mMHlTXGkuFyjW4HE6+/6YQewfZ78m/DJsLKxECMQU5u1JFqEGwXtedCXFdZOPVnYHVWQ==","shasum":"20e51c4cf7367e538ec251cdc5484d4a8835b2a4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.12.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQaYCRA9TVsSAnZWagAAhXgP/2fLMZXEl2IXpfDu3EJo\nZbtWD7osNuvpXoFhR3W9LINf/p2qIu/H70NTsdgmmo2w7O8fMZG2ro8vNx3r\nuJuxRjySQh1aEhszA3vrYP0/e92UyDrRgKEWIg22R1pvjhqWl2lI1s8fSmrF\n+iNYyPcpM6ATbRH/dXeHc2O/Xm/AZkrdqOk9lLze6Xx2HHewHbO/HeUxuY67\n4A+CHMojPxmS+1Y/xmz0A47T0febEiXHMwVz9R8yer0GaSz8Ymj/stjb0L+K\nvDdDGnr0W8pQ+MrONl1wGlW3Bcp9ymuWvArwvQuYV0g2ftrA5TWOLYfvu+7A\nGyQ/rgUdYG0wcCTMYGaRsUvs37fGB4+sJx2uLxg96047t+uIS1V0kczQxo+Q\nVahK6/vd2ht6oAMTwTufwjUgPoaVyExmCUbc8thgbOyta5zfTl77w1OXSAm8\nYgCUfkqZtjo3vS5DSBJ4g0FSppXvjinhMxn4MBZWj0Izxncxw3tWSZOJeHi4\n8+bnZKjxaEXavXjmj7nsmoJRaktrgUyNDCXDefTpPTpug7Lpm5xAVkC/YwGp\n4QFWmpzMgSKNTBUf2+IPvL4PtSEwJj9AMVAdmfJWCza2Pekt6h+oizleB+DE\nuUzwc80kf6Qz4mtpecA4NeoMdiyJz8iAgPx63i7cBL11W1vEQdUmwLIeraoO\nQr/Z\r\n=CJ3F\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDH3ZxfWCfnsAZ8fdgNSrsrvrsDvpGmCGSPBqIss4CJtgIhAJSoN3EJDedrtToi/5K794zRcg6k7BeAu7hMghuzINyR"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.12_1573717655638_0.4707561348086873"},"_hasShrinkwrap":false},"0.11.6-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.13+d2949f7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d2949f7b904729c4d9eaeaedfa5c5ba64214715a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-jGIJB0xr6SKEpGt5IwHvcaEGCLhh7w63sbpuSyx3S4s3RkXnzjTbENh0auC05HHNUUtC8tx89gRDiwZGH7Dfhw==","shasum":"30931cea3e8993af717e76a6e16f937bf9b4fb62","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.13.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQbvCRA9TVsSAnZWagAAhpYQAIiWvN/tjxsxl+TojYU1\n7pcrj3WbtE1frSfllReX6VSFOMmvKT136ittKwwqxrzWkLXxqutx+P8/iIu8\n+niEz0QbBfIkydswUvOQvPM+Y5X7cJLHaXMvBJg6yAs6sP87Z6mSUCWPEZQX\nmJAa0aJFaF+FYqPO6uF0TrYcWS0Kbl2zqe8J3t+zoKaQZKpt9o5ZAXdUi3es\naa94x94pHBAOrIVrbAuwdlEEedR3cf2c1sARomWTol/ih9xQSH96P4aCvq63\n3M0adnlUwNFG4Zh/fHi7q4WVgkP/etge4wprgspxSXTkgdS8InNvvuzHPBc2\nqP/vQtsLbFY3/MvNrCaay/QuF/7jaKrc2twmHpwHDzU2w+4cJXL3b2liw+pd\nPdZ6FpxzkcMHGhM0eHMq3hWtIJOhClnUgbmtRnaM7M4noQ57n7oFdtght+Sg\n842VtV+6Pt0s0fv2GL+8CinzMaFcywkeKUyqtOIitSQMtrCnrCRoa9Gj7upS\n/oaUrM68Uim5H/d4Fhk1rlDCsDVRcuneJBxh/5Py4hZ49LNpyB2MMg9aoZu4\nWX7QUbk2YV0PPcEd4my6/DqMsvQKGH4Nr++Zqhn0Qn8PUA7mli63XLtrWvee\na+UdN0GP6LIBbaBw78ZZdeDMjQfDKV9D31NiF57bXxKEVDIxdmc0A1hQcD3r\nicqz\r\n=L9p2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCfKeFVLgRfdulLgiIzP+vetCdZmcs84ds0cpOCT/ymQQIgc092W4qS/WowFhv/YD/7A1ZglYbcbNk/S/bNWuzgR2M="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.13_1573717743558_0.7025496144333025"},"_hasShrinkwrap":false},"0.11.6-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.14+0c5d863"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0c5d863c2c9a001f14c920c2026064d67cc3ed1f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.14","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ZkaGpZyfeuKPVKwmR5NBhP1Tey1GMfcw+5C/ufyt2C18fPwkqmbiLeDIPzUAnPIfx+6QxgAZM8OR8b0JeLqYHA==","shasum":"b6c2f1d07da92dd145b14a4e291c5448443806be","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.14.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQi3CRA9TVsSAnZWagAAHiQP/3UVvxhUpO4MJkzHhDFD\nkBHT6HVEKpEDL3aiPIPl9M2mh9gO+LaBkqnwRHcLz3KjWNfPNCrTYPUBiVSb\nElgN4lF3lRCE4MGD2nP+xl6pFA2ynJfv362WO7DxPSya9gDSsgvt+chqrinI\npe+CR5v8rivU3Fbk4sX1KBH/y427aJKo4o8Iqh09y9pY8I+1ABX9v+sVY4HM\nc/HgGz1FycqSbIpYd1gaT71Qz+cnZdSNIFNgGva95Pb82pWnYDpZI33wmlUi\nnHxIq90MZgZQRlstys0DHkRBzpu3FOM+u+r4QA6zBPydQGVUi9Ur00r+wVXw\nc3zd1gInvzz9+cQiL+R4dtXmITn8y9f4I9T3Ia2aKxmVs09C7BnboPmWIAEj\nPwZzgBuSzDRTcVFomxoGVzeR5V4byF5mu3innGTXhj4cFu/rs4Ll83not4av\nNJX1xNDLakcKPBj7Cbg8D7/YTYlODxXY9Cv7GSVJCV91fzKCyBp71zKE95Tm\n980YtcPNvQvuwa6SmzIXgCMJZyUFrw2f1FnZ3dSFG8x3Fb1vqW4U7OhbLWhT\n+FqT5A8jgKCDZeVb5w1l5GOizImxBG7FnysYSsLlgVSemcp6NhofYZx+Mvyg\nXy6RulAlwDu65bWSEqX1DZYAIidFirruQaGJDR+evIXDFhPzFDbGakA+DKwq\nralx\r\n=dOZN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCd/R4tHIx/R5lYBWkT0QSWPGlAXhPe+vyEzM/8KJBf8wIgRslKqAaT6TUxwBrpY4pCqRd9dIrPo3CqDLwSWRnd2EQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.14_1573718198847_0.8242269893609151"},"_hasShrinkwrap":false},"0.11.6-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.15+4cdf821"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4cdf8210e936681926537d73674b7b65560152d2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.15","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-dpmHHRkhH1pRY6jBBYLnFyFawXEOQIsj7aTWLdm6WP8FuzQgsPaAWBA1VJ5alWImzmls6c9IwyIgp1w+AFpbCA==","shasum":"98bc501def5203cf96dceebf02a3679ea508757d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.15.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQk1CRA9TVsSAnZWagAA8QwP/2Ii0ru2qb6goMBXk3DH\nbB5dcPPwcGv+bbXYgQcZY/H+tdoWo/n9tBM9yPYD0zdULw0GY58S9lq9Bl3/\n987P9YJAazpvXpi9EisMBe12BjX1S08aFPZSWS4dXKLuivYGC4VgdLFBqX8S\nP9jE8pXfhe5kdxU2IY77nFzKfhnO33u1gQDp61AhVT5uZWgHT+gzwTAowlYZ\nZpZ4vkifZjSTxjHijhbQCi5FASO6DiTo0iuM4N0DQJsQxDqgfmQmvt4ZxgUX\nUyRrBQk9CWczLgWkbvgrjs0xizPA6EPZitfPljqD1TItp3o/aLozi8mlQYIP\nOaAmvnW3TDXzC/z+5ET+yrnFJe5bo1LSYkCPpftDxK+0kZmtuPsB/cH4P587\nwk1P0iI4SH0BQ7DP28jMt/TmrTuJaD1/jjR9Zm+B5/5Aq/JhaPBtmTDa3SCY\ndLYnd5oPSxyDb+y+srEYHDTUobAlc9CRpJAuUOD5yFebbcWrd5IgbGefWodO\n+rjhBiEbpJmLBLUpqCpUW/AxhKAiGFNtPbR77T8Sud5S3nyDk6h+I6KiyHx/\n3kGSYJY6q9UhufxAEdLMhz08nnVUB1dxykh2QX0z3G0F/IQDvOIoOmraZqdx\neo1+T/xJ4Bhsuf1FIezn43wkMAAD13Mxgky9HWfBFu3+ZZclP8YsQvp1dZB/\nXrC5\r\n=+wdJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDJfhCRQP77HrnhVxZ122e7bKRXVZgzC+6nyQAAyI34sQIhAJiIU+DWAGIhM8j6gDTllBLnxJ1G6iSG/YDlCE+Mp1GK"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.15_1573718324611_0.1826386919346985"},"_hasShrinkwrap":false},"0.11.6-alpha.16":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.16+5108258"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"510825814fa07309e0d61f41d26575266354f3ef","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.16","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mo/NrNK5WpkrR7MKzt6Hl53q5W3nXK2dkvmI64f7iesuWpss9MuYjNEfy7Wfg1TbfJUsSwKSfDmIvOeirlxN/g==","shasum":"298f28a24473f3dbbb74b7e1fcc7fd0506819807","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.16.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQqICRA9TVsSAnZWagAAsBgP/i9ksAQze+UIUqLObwfk\nwneXDhvztbfE3CeDlex2oGYDu6CV9j9OD93HSxF8F8MCLnQpoqP8meEz9Vye\nGAZ7xgrCRCwzb3C6xx37PjnC+uXbqjf4zSehLmOmLNDOzQ08865lzHqZCfea\nwLFbvw1peofTZ+CZ+6zxALoisPnNf16b0uA51kYPo2NSD7aqdjgiWjG9dO8A\n55RAZVHqYTNrbc7Gy+7u2K96Ai2P52ScJZfqbeWxA9J3m7ayjniuFcyGEp9V\nklRilEkLpX5FlxPWYZrrYxtIR/Y7nwMh+/+wT6eqEr2ynZ7H1aNTnPgTvlzp\nP3eDSSO5wSmAfHpr+WCB1CvYzflo7EMWM9TwDDJSo/u6HEiaRYjNZ/wtnAMD\nSWPAFoigx04Fl13H9rkhREHuFT9WmWlkajiVAPIb8HusnQolNsWfpr8uv6lc\ndK4HjhT1LqFC0KZoAL/Pu4zjBAXQkis5T01EGD/0UrT735SA/ggM6aoRTZTn\nJ6IMKUqA2PmucDwPQlrzLRizDhuSwgjPZAM5yKDoDTSlU5rhQKnRd8bWJ52Y\nKOTzqgOzeiEi9+gOeu/Xv8WS5nz1LdnAwsNKplTluvtLkNF6rRraixAE/g0z\nXAQMUPnctE8YyAsgiCaG4rlsC2kY4K53ewl2OQpD6nfH2tGPMCcc/0vEg85g\ncDoX\r\n=ZADZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDyQWVOpjM5QlbwX7u8bM9eeWRD1OChCIpPRf8ZNpWzMAIgB28kNP6HmbUZn7YaFXO61YCgj5YvlPLA5+ZRhl2nsBU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.16_1573718663935_0.07883644641659315"},"_hasShrinkwrap":false},"0.11.6-alpha.17":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.17+16bf2ca"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"16bf2caa7c4a52c4a97d9fffde0a23fde96e4b74","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.17","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-swcGR2v1Jy+EDBUd+mvtMEBStE4cQcr/UopPLGuxJ9nyUNgnoY3cKpKnWjBPNyY1AnQRBygNbNfl84xn0kVV6Q==","shasum":"d0486cd71fa45ba9eba29e2bc972d3cdef6a6569","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.17.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQtWCRA9TVsSAnZWagAAYbMP/jituHNF+m8BDzc8HiRq\nYtdf9QKK6d78Z5nchsHVrrcicicgcLiKAAdNw3UUmGdeR1RNggNGKpGAAceh\ns6e8xYy2SLooN1BoZKtCpOCxDJg7nro1HS6fR8ND5+Lb6xA8YnaM1A8Ot4gP\nnIYYZAZstvczjU3KI/ogDYksqjy8FTkzjTnVoa7VAWFLux5fNh4zHrcWufNp\nrOTS+wsnObeAkTup7w8Z1uPvwLN3+o/SLRyA99VmcLa5P/VGVmnlRkBnCr7D\nXrttPSOc/OXK19wzCTdz9mO9iF2bQFcExIn6ebePrpqoRGHskoXJaQ8F3oVq\ncypid615A4BbGKuKiuU40OYTW/W6gWo9ueD8lvOyV109cba3j8uz44rbsQKa\nv++oQkFFpS2+1R5ZY8NDio0hc1oQcG0PhF+8tUEUYQvsA+7yEvuiTQQmE+vM\nDKnO+5dHVsj76ID+4uzGADYrQ/5JP7ivjg+iywE+SrhyZWJX3OjcbxTmsMhO\nfs7VIYxSMNJ92p5r/zQ69fbhbk0doe0nICKwU/F35M9mYbWWQSkRJlmJk2eJ\n1RWtKTcWZJ78s6E41jHmRylWto2iTXUrTaWiAwqsOo2jcCSx17aP9EVOoMAg\n6TkhN/WrikNTMGY6MpYqMpRx7kuXAE7f0liiL6xu5E/PnPlpgE9J17QHYiJG\n+yFx\r\n=gDDA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFeQYamhkNz6Da8mZDgbX7wdCW5thtbFt+iVsvF7uFcbAiB2e4kYinkjPa2SIDyHjX8Ik2KUV9rGI6HBMK2uU86/JQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.17_1573718869770_0.9239544610091928"},"_hasShrinkwrap":false},"0.11.6-alpha.18":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.18+24486f8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"24486f8ad05e449dc237b4945823ac4b6232ad93","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.18","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mjqg8Xp7JBRVwfyqHNbfR/jdXg/w0jbYm1AfWB+tdEwYtoQXX6iO0YJl8zcsasSqlRgc3FWRGh69zLgAVm1Oxg==","shasum":"2e267f6a4365ecac9e37e66c38fc35acbf5dcb88","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.18.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQvwCRA9TVsSAnZWagAAJPEQAJnhrMaavIXepo8KPox0\nzmCGFDwKDhmhQpbEPr47Z0OkCrcDgwKaihIBPnhtN6/bA6opiBTgdvQjNLxE\n+4JFpSc79UXvc2P+QtzSJ6bM38SWUctgs4ugoEYHeveifjF1QwSpF0nRf5ab\nWfvmChINIJ/bMUOZgD69OGl+l6cqri9SRYkSvfumb37oDiXDmdQX2PB9VdNh\nkWJtAaBdIVWEz9zQCVWgfqO1e3Y2lfqmKMzpgwpnBGdBLACDVvo/omtFxCuu\nu6KADJc+BVv2rrN+y9iHB8baS72m6BeAJq+Vz6JXSzKdjS6Gm3A2re0/2kX5\n1yHz5WBePu0kxSWywyTvtHUkUTiQzm7m2CxhZ7qScQzqIbPDyFsOBqQrFrx7\nOmQlFNFajHFoRkJpkNlJeMs6BS75xwXS9nNETbdtHq29l8DBNSutf6mD7FVk\n2mnnZcoiNEQQdFKkYLWZhuWo7x5peXEP+rmrXtDB8TIYcEMA595d1b8kXZzS\nTUnwbw+lJ46SHe/HIpAan4qCzRqBMA0NQ4YbhrsBUtmOBq6c4zC6rNDpVeMl\n1atEXgryZWTjOGyuGbnmMCBk/UOBvGDS7Id4T23yLKn3pbC5TyVpSAlQJnYW\nhowX7+9MlNrpw9PrXyoGxuHlzjA44fdw22Rn075nsfDBzrvhz/kdhOEYku1U\n7FRP\r\n=8ozm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH64xhUDEt9vW+JbuTgARC9h+phY7FIPSfxo21qhyj/+AiEAlG2sLxTcKZN1bkSuFz8FYgIIJlblHzVce7+Ocsi5lZE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.18_1573719024166_0.777294841452125"},"_hasShrinkwrap":false},"0.11.6-alpha.19":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.19+b1e8a35"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b1e8a357b0654d821a61cad7b12cb5cfc4a68eef","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.19","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-LDO2kgHhiGwacpGLuqszOuOJPsxvA8fleDP4BKqutqv3QgwsPTZlyki+pOJtZxjoZSSmQavi/cQeuF74d7kNMA==","shasum":"3ba1d9bfb5d76d25aaf3ff33cfbd69eb0776a712","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.19.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQyzCRA9TVsSAnZWagAABzkP/3MXzZ3XDQqJsXY+nsKB\n/3NQu1vLb7ow5wqc9MiwWQ057a8IwggLDYq42eo2rcVDr/kGwgKl7dnZwn3V\nMqkYk9DhyAXWWk1liOsESYhDfsBj53OFcCrl7PPgWyqAx9bHoStIFU02KPVv\n+LFfnafJ3+4j9jgEQRDgkDcODra0xG1fyyuImcCqQWTQgrAZyEHfYS062Vnt\nNIzdhIiJtnM9BmjK1wtpjjPM5dnQ7UQeaTLfE6B3YmhecML+hfseTxE34Mjc\nqxsjo8EHsA5x37OcB6V5Cr9X/XpLsam9YHjWoTctlhPwiZxApAdwGWpCvH9q\n/aamgy0S5M6lEJElfNll5zZuWW8bdVcgcZF4Whg4fuRSYf0oGRTb0d4NV2yO\n3ReByb25Bq6owNk5Lf6S1pdwM0XDglNhNB5Iv0uYy9ij5FwL0Z7z+ydnWLS1\nu6Hog/+zW3tOavPSsPf1tBpdDQLcFlM6yR5JbWLTf9Y+OGSGvxALEMBNXgdc\n0IBYE7yh+VHPcykQBI+UfDn/CPLbOGGPXW3f5L33RwVtcRRtzhXL2LuL8FRE\nr5wk5K80Nwu7muhD/G8S30mJyCnzzPNUEJp1s7vS0YbCSqQYBrklX74psfRu\neLl/5MSxQX8D4+eUhaDQcv/eInrleoJlBNlGQWEQuOlo5GhL0/qMvM1DSu5v\ndfyc\r\n=G1ai\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDSOWKDeGwSOt5TjNd8vxn5DTrXkl/IE54v71zEXgpVbAiEA6V2dSlbpaXF10KwD13GWzGkFsj0avzDF3JUU8LJAOxU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.19_1573719219470_0.001715943552174748"},"_hasShrinkwrap":false},"0.11.6-alpha.20":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.20+ac223d1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ac223d128b7ca9998c770190828349629dc216e9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.20","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-cHdrhRFRK+RwKNKJbCClT6byW5HmPkAcLYzRw4mQZkgR7f0IRGA1r+C5y43Hk73pQg1P/9hB/WEbWmByjX/AyQ==","shasum":"b86a1304459a783ab9aa04df4fd97beb0b21394b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.20.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQ1MCRA9TVsSAnZWagAAxboP/0K3jwS/EwQIPX90UlaI\noOiJOxCc3qrSQBjgyNuSrEZIb7NeIAyxZgpsUWwIil6UODWMDBA1hNU2050H\nrNSAVGBLMiIMtFhBSMUVCJXBKvxLClRjpiFXd8oZINhxA85ORTd2/lei20XZ\nAaoZVgrSaDfgf+uWLmDOzDN0CoP10JETOo6IrH2Qf48lKrEmphdiVEtz8uIZ\ndHcTCm7lD5kLGmgCTZTA79SkNu/AD11UjZa/vV3Y/FftXKVYAGILrmA9sac7\npagOUrFI9DHeWAJoU7SxBHR4txTxwne8z+Vtbwrr050gKmllnWamWPUIQk0B\nQowNdMMrYtxBBiF6rIgtce3a3E7RV25rHF+euDP3IwiSTO2xfigfqEmSP+3t\n4Om+5AQmjoau0jlsPJg+oH+8hPGEM6yPUvmstXKP1akfbZP9UeEsY+gBDov0\n0oxFiAi8Ycqqw8TdyhvjdbRpZvwtChprPgnnWdD7uimKm/jE2XJ7Ai+Y6Vr8\nIkvhrZUBv1ckksHmJei3Lg9WLHSkDsluN9rgrM+SdOjR5Gi8Qavk2cQev5mQ\n6RSF2aHSkpKPgg8ecNbWHVmbmiNfiVMB15jt5xPgW1KFqfwFaChVwc3k7ZEK\ngFIosVjrsqsgtwmnY4/83ISe8k98dV8S003umTqTqmxxXUY9YXPLLMCiadQS\nTBse\r\n=m4zT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFJxKUIddBqFtYleoTr88bGr1ZOAKANYIXOUuOjkBHb1AiAxbdzFqCsdU8NHSgi6edS8gVpVFzFSNXJ4RmrJmOMGzA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.20_1573719372386_0.2359397749577341"},"_hasShrinkwrap":false},"0.11.6-alpha.21":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.21+f97fd98"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f97fd98f295d44e11eb5b92553a905d82e90c754","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.21","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-nqOq2cXnLzgaiPtVGEnCm60EbPgn2OvzUwBs7yRoA4QKsxXY7rjH/4AoF+pHaJzS8QqjVnpj8ogrIHun3tNMbw==","shasum":"26e9a847df8cb0beb11622b02551070ef1869d11","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.21.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQ82CRA9TVsSAnZWagAAl/wQAJwDIvDaYcPGhbRav5VV\nr5DE5rSVOonrkhe3ZURbZhfdkjwmgaev9qNX5txiqo4GC7valw2+OGo893hT\noXqdtsbHwEz1rzL5kM9XlPUnYBoRnXiJf1MJ8i5r/mMB7HyW0Pukp+p7MboK\nj+CWNUBVyCydjzJwCpvaTcfCp3ZPSrOMoTHQFoc2DnRstT4wY+8GLXc+yye6\nT2qP4RLj3qkGMSXWjhM7scD9NAUqwmZdxQdpNZ7aae2OVg0RNapKMpC9H18t\nFxY4kHpLlirF9b6cC6Mh1DlpiBiP+/jWdGd87bVGyOB2Mf1Ej16nQ561os3H\nBICqLQAWrjtZVkh7xTvm5hiY1GvA/enrj7+AtQxIBZORDHA+V1w1mjuVnHgl\nYIn9kcHT02aoE5bWmIKc3i08LIElar3EpqRWVBJpSGXh4SJea/EMKwLaZIgR\nloUQssd/2rL1l0R/SRqqmGDpSpXYjuXSdVFw04/Z3AKuACl+MtgpECNbBuId\nfhNMSHor5A9cISLXnwaRr/3ij1IwUjwR5IL1p7Beh/+nIHY3fE5j6MtIgQET\nRlN69dgMRD5T6oW8CkCVePL/bVPmEY/BGvmlTGpXqw8yyJDWFDSvDK3aP4Rr\nc2Xxue9cJ6EjFiz1ccrinprpz5RHM4G7WSwF/NjwIlqsslxVmriBXBmsdB29\nmpcx\r\n=pw4X\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDleIY6c5omdQUJaa+yHjrMI9iN1MbTcNB0m4fzqyotFAIgRW67I9J7nzWyHKIG6qEy8F12w2qolB8SnNns/SXIBA0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.21_1573719862013_0.21634089604878426"},"_hasShrinkwrap":false},"0.11.6-alpha.22":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.22+ecf0af8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ecf0af84119d7da948ebf24d0cde2b0799452839","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.22","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-B97KGoBvRuVRuNSwiyNfYESpvX3Cd8RgPAr9FvLa1ZvPDenf2Ab09HelOe0rbisFw5GbgKqD6sF60K4UC42gGQ==","shasum":"d856a0efa9f0b223e80ecf0fb3b4edfaf02a9073","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.22.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzQ/DCRA9TVsSAnZWagAA2/UP/i3cqlbIOjHDbpgKsrbf\nQwhJwEaISOqupU5WX8OS9FGQr3LPdU1Jy044BDeZ/ID4uHp0xXVtggQQI13D\notRCo/DozH/PpzWis0xtM1EQM5fItseoImIhkJ/BYufz6RaT3LCVXU1NAiCX\nKcO0JH05kmr1X4xiQ39wnssRt2nn/j7V2foO3cPWAF/a2dYUyz/les3c93QR\ngCf1zH3uzVNOwf1SuU2PK9u4LtWJHwN2CqZ1PoFVselCd/CBqRJNm8L00WmG\nuw5j/fZWMLIIL9AEURNoM77qREapyUqLjIje5hcLf0QA08XA9ONaMcsgiLfZ\naTcVepKickX3RTzbWbz1w7ctJ4OFu2uazfWyjtff/oGvSYGxbHcBkeq0MQd5\nv8EZE2lALaTT8OYPFDCOP+DBbFqfi0zg8DhIvx1BHogSQr2TrQ/KWBt7LB7s\n5AI/wo8Qf8PzIwlOVNYERbn4Yg7u0f1cUMIgHNiwpbD6e8Htgt09aCXMLYRF\nZ0nzSgHbJ8BS0wWAtRiFdRLdPQ2fMu9W5lSYB3vl4VKC/cM68+DYUJFEVpn4\nz0+d20i8ctK1992yTGUc0j7mDeyEcL/bfhev2kGi0bg8zkWdrNYSpK17LUTb\nGi3IxRBOD4M9FqophD/NJF5lOr3HoNBSgwC57n7ptg8zZMO0cctjeCXO2Oig\nebz+\r\n=oG0W\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFDNYBQxw5sxF+8yPF4Cvc13zykK0xzjM12LhadE9l2/AiEAy/G/AoaBqqRSTqY+OqKvkV4eZwzizBhEZu3cFHVlEBU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.22_1573720002692_0.44615351932749303"},"_hasShrinkwrap":false},"0.11.6-alpha.23":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.23","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.23+6230457"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6230457c99492896be802300e8b759d519d4872c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.23","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-/ZWzdjGo2SL/mB8lGD7kcvtAq6hHRcAeylbEr9gz8DoYbhg0ynA/WFqaOn7QfQQGyQJhn5fCJhkwIXv3e+bgrw==","shasum":"611164456413665e858138ea892af6cc4c20245c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.23.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzRAVCRA9TVsSAnZWagAA+JMP+gJJl1hsCnlqjEaYXsuF\nFck0M7aoYT6TTgyZZnR5ZRoqR+zeHUiDp2RRF/+pP3ylpFG5FvXXiJl0Lema\nusBfykbNVAcidPKo2Bsnsx6lvQCaMIGZctEiGI57yHhomIaOPR+kgs2m7lD3\nO2FYMtIVuNXiXOsEneR2Ym+yCSUP8Vsd0ZhqkW2vwcXWXj0a2kSqVe0lKIx9\nDFiSeL9mzwQ4UFqV9ryCpwQUAEZvfYkHysrRCOJN2UKvH3NFq9ILAPpcBC6T\nGYIgKPg+ePA+h+GxVo+WrT57A7kjss8tpkVQEllGZaWAbfEWX5gbkF/sLDIA\nbfC8rImQHw8hzN2GHFSynzFQAlLcYGzLr2A/lEj43H0fXQXwTF5gdK288bWP\nZliaIa6VcdSISYHiBcpy6O9ig+VFQhwVBx2yMBtkAV6dbwp+q2FIMCksSUg4\nD+JZZe/QTPvstMuOrD2+Mg1N4Wo0sLpMAZMS9N24P2L4qGv+WLT/yKwPBa9m\n7Fk6XvLl8NGkFwXwAJMv7i7ZwhjQ8SX8nAe3w9P2l8C8GS5ZDj3YhIW5y5iP\nT4/gfdtPeC23U2AfdfQxwukBYLmq+uIRv/JsB8N0y+2QUrIGtsRyNhvrhZJI\nStvI9IsgA9a/y3wkHS+8MpP1YvrBOE3HKnDdwgFbUsfVny0widbNgpZUxeBn\n6myx\r\n=0UTJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDed2Czavzvl0+A4x9LiSdf/4ESyn0sWsGyzykJRXHiuwIhAPMjj4ik0yThGVTrNsyGngQTHh3VNhcfzetZuoar8Yuz"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.23_1573720084975_0.055167282114786165"},"_hasShrinkwrap":false},"0.11.6-alpha.24":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.24","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.24+9e7ca9c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9e7ca9c3d71740b97b9b6827d086b5661b585519","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.24","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-9HLn20p7Qd7+WpKbNBhhIDVvdO4I4eMnUvzR/Ea/1Q8V5yt22u6OVEK7VJjmTP2XCVUtvgCWAQYu+2J7o3nDVg==","shasum":"f2b20f837646a493bcd144064942f1a08ef9f41a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.24.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzRKXCRA9TVsSAnZWagAACXQQAJbK8MYDFzR08gMk3NBP\nxzbx2FT6w4X4gslL6HkBzhKa3VygkR0xzC21WDKQFEzD0smN2VsBfQljpWhr\ndn6h1Jr9cAUgqrFJ8yDJ7NjHFSu0mf3AX83cbGZZUiaRLU/cX9jrPLysZKXY\nEJ4N/gQ5Ilzq5fgQhYtqRA6jezYhL8WTUL5jwfwtBeF0ZW0VjQJn6+VOsPt0\n0Zbol4dTipYVRhNSGV6r7InA9tZFHPBOq6uS00QvAF9725aZcFqE7YUYvjqM\npOxqJR2IK1+bE0THGyUjsOjirwW3zffb+I/XCs7VvVDc5PGnAu8pMKCuCwm8\n6U590/HHj1v5BYMXD1rqZKeLt2C90d+1Y+IGAX8YM3UduF49KbsESLZIhVhr\nn277kD6+HCst2UGbvSM4T53dOfP6Ez5lBsMcNBmJAejCCQg9DBWQG3NGgwf0\nPpgembmvw6rfccNN4Qyv18IGbcuBUs7dbvWrRCYisTNVmhos7Xca/P3To2ZY\n8CmocF78cTcrr4BS1G+fKFhQIKDZ9MUikjBaxlfPcyZ62nh1y0TJfjtfcJ62\ntuUQm6yBQ+fQl9HAB8SgJ0N/FUPcgbEsMeKb3s1seNdccUqXEiZtp+rypELK\nYchfujnAvbMveVUDMXRGkFc5dm1ygSvWH4i15nwu1vjU1arMyfFnDQ5ELFce\na5Tb\r\n=BUJE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD4p+chC+kvr4XQKqmGIjAMivk+62GE89y1THNyqZMDOwIhANczrJUw6TjUKEok2I2TClK29L0FWLEAaEGO0OytBcEz"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.24_1573720726912_0.5809038143779717"},"_hasShrinkwrap":false},"0.11.6-alpha.25":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.25","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.25+aa62743"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"aa627432c2448b432d192ccc792e0c100a20f856","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.25","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-pu3JlFK8NX1v4OEQF/8KRsUdprOHQO40j89uSElUS4Z0k1+8Soz4GXGZZjTLeEhyyOYCLTcOlVpdXF5mzUwVGg==","shasum":"7923c4d5ed060210747d6d88777145eea52a043f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.25.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzRLxCRA9TVsSAnZWagAAhm4QAIVua5FDtTD6aeSUKPGp\n7HwRTo5bqWy+sArGev9LHEfoPTEMYCPeNF/YGLe6hnNIXqPQr1HWLRro/JPe\nfpKHbvrgx7LRchzFDy6UWX4S3dTTqwdbBBwYtj7hahXP5MkCGKBU7CiP5MiT\nM26mRzUOju9w0K2IgMe7ydGGM8St8nbI1ZTpeXecEWfR3wxM4RNlq3LUIEXV\nAFaP/5Kdv3k+MCluCxCtjogG+11071qNAud+a1LaYMvEgWJIzxHSIA4nbnPs\niE1/ERABoL7HAcjy8Oya6r6NGtgve3XakPtUZTpg1ChXJ6+tgwqN36XY71Up\nYBYOVV/SuJBbgHTqtjpwBa0DgZbdvpJSIwWo7MLQ1rupdK+baxSy4GHqjTYr\nRghpMZQXllyW3dED78Cy/Wx3p6SPPfDc75J6y4rBSnFezWVYZFi0b3twQvT1\ntxd7sATadOxbECJzItYLMo+7bVAVQizXGOSeNCIMoD7Nd7K3nhfv6Yhorh8Z\nLSrRJGZc8F2R0htvnejNZCrRH9MOSGipyedpADVOEiAfj9zscAzDAcFuwoAX\nauZ2d3Px5fAoZq5puF078uY0LvQLSh4QlBSOU8eSfaiF8jpxL0QniumScTig\nIAwCkSwG7LRhqNi1jxG+wrlSYAq5mmtMwbfjs+uJ87ve651DryaPsgN9WYQo\n2Cdi\r\n=f5cj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICqNCUXWUBduTIil8q/P5qLxLqN9yXJFxC51ZkpMTzJHAiEA9DxAw5OG/FyVkfxLJii1K5FlNRKK526BYzuBtf+wACo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.25_1573720817045_0.26153711530963086"},"_hasShrinkwrap":false},"0.11.6-alpha.26":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.26","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.26+6a72e8c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6a72e8c732418dd1bf4ad073aa2705c87d98cd11","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.26","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-60T6lZfrC0RnJ5LdjLwDBsq4CbK2rJfoKGCINPjBTzPJmv10+4XRWVsmY+w+r+Z1ja/SHo5CVCTvDEsceQnuMw==","shasum":"dd2a7c56b1e80f8872afa6cac2aafa40201e441d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.26.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzRNACRA9TVsSAnZWagAAcf4QAIAr6J2LxY0PM2MJuwwx\n9KH6b2v3kBBvrpIE2RKW8796cK+f4A2B2+5+6iYIMPfMCXScCfm5wVQLCKWQ\nKnB44U/W8STWNqMNuqbANan0UBvL0s+krlHfaIJ7r0tfkTu+E/1XWQOnsfAc\n2DpRMfBJOCxtDHjkQ91V5TaT9xxiEzQC/sLKJiqlt3HccXHvju2nM4A8osVb\nBq9LSeWs/xT45AWAluKq21225rd2QRENL8qxu9eRURrFAI0+aTndXnyz/tZl\nmxa+Eimd+vjEpzIViwKtmgPP80UCmHKPZ3R8DFEYpE+lDZEcuh+ySxniWEY9\nCwVjMX02pF71LT7M/ch7ZrZ2PAoFKqPX9hIgE0arNis/ZQk0iCnxe5vZKQAw\nk/3M7G9/Jhj+Zpx5qT15+kYZgmfsforKvCAzcY3lfiRaWpXfG5N2mqvzCRAf\nFbXvJHO7KfBw3ZCo15kvCH5BtbrQqDwaIU55i9EAt2hzGk4CAozySsXF3hEP\nxGPmhWa8JTb8/sTAjVW37r8IwOaLZRpaI+apf9wQy6++YQJvYG3aJrSzmLSz\neEsA4KrlM5JVdvvX5ut04yr/HqJWdAUAhn/pRsG7+WUC+ZeWryf3YnfOu5i8\nwGiDsHl8Df3IiTlOa3kBfn2lRz0AbGMdu4be5RSRwonGRD2C/w6mNiWEWn66\nnGxI\r\n=abdF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIErbtHEMe4YoRMgRM//ELgbe/rK143I33Ab91cpGCVX3AiBt1Xo4fMzsHnWsYsBObaxE2/GV9VtGSES9+xoD12NGcw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.26_1573720895706_0.3476351962163573"},"_hasShrinkwrap":false},"0.11.6-alpha.27":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.27","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.27+18a9be0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"18a9be0847ca412d5f549e929a6f80ccb2b580bf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.27","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-UTwUUYNy4uGFsWcZs4cWEyygyhKMYv/aifIAXrGWZMX6PMyeE13NRCI7GGFDaGa1Rt049vxJ3ZHb0jBb5/iYsA==","shasum":"b2b2c1fd33d47efdea0c7db4970b7101b0a73bfa","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.27.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzRPACRA9TVsSAnZWagAAo2gQAKR+JcaiGvHkfCJDeDh0\n1k/tt5XOzheiLtnjojOfMimbQ7yI1auGRyny3YAn+gfH8LUcgyfjcCTh8FXx\nn3Mg3cgoVz6yjChTIrtdO02OFIzTt9fKnv8+nriXFGUQCr0YS0uxiId/c0J5\nSB9zk3k8B9rFS/ipZjkLqz6F01y3x8xTEY9QajvWSKvnTshDjWnFfMV0aDbc\nabu7Q+6ipYShNQFTk/fEIedLwYBnrqgECgNtnb0SQ4KLlzVwkuWNJws+ZV2X\ncCeg2QbHHLLhdOyvDuRwBkoOU4lXuX6g9+v4SUAeTNORGmlMfgiaPKW3OTeW\n18Fl5qlAi4+QV2Du4Xnzdmd75OES358PQiQoIotCxpcJ5V3BkeJnilw0QwfK\nPE14Df0uUNdW26ScNLJ5nRJPghYKosXaehMQdkzge6VnD6sAr19GcfedkJpN\nhSOSSyCfipjbR++hI4Adx3KFXc/BGvcaPqE2rDVKpS1zSh3cRTGfW2PhjHn+\nB2ci36n6f0Q69oTjGH4F3l22fTEaU/jTF2bcp6abKqDotYfISMOc5s1bhsho\nxmbfg7V+qgkb6hBf2dZWwItbsckM8I86QwEnWn2WY/WV/7WDdwS3GZqg9zmH\nROMs6BOuCjquoW0M/FfG3bUm1GWLsaHd+2yX4KbPWykmMEZkO75q/QkoJNyr\nOwY4\r\n=V6Ev\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDiYfTwU4gh00EeulJdlgs+JaQjnsVQGY77KojK5etleQIgBmbljS/ENLJWJR7oQWVSJdu66sJhK/5ryXc8oG4IauU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.27_1573721023667_0.8901559485876731"},"_hasShrinkwrap":false},"0.11.6-alpha.28":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.28","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.28+3fd28e0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3fd28e09f78171f28be8a9c644f0c22a5250acc6","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.28","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-0EVS+HAVF2ZfW0LJr2E8nQwi4FJs2LbhC7+O9yyRAhzF1x0TmCWbetNtzBesQ5hdImFzk8GFA6i32y4MuP6pjw==","shasum":"1acfd2b573532d2965ab592c67362de622f280f2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.28.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzRSUCRA9TVsSAnZWagAAuFkP/0b02UXDlYbuC4NFTXme\nq3nmxmnlqJ7GXAfxWIkvBECWid2rDlDxT6qA5bdEVhpCY/VScr9hwB+3orSu\nomN4k+ZOM2Iumh8l8N+qCLD2ZjnYupZc0hKNTfFaZdd4JHrDCK2yRX8iyynz\n0tBCHHE1awHyxWsxEuRUouoqAe33uuzZgRe6jFgo6mJh9CuLx2MKDFyF+tkb\nkN/6S90P6emPc3/I/hsspi7Wz/7aVcPPFYBmq+dD0Lk1W2Xcz5ZHqF3P1YZB\n2eox/84kZLGTM5aVNeuyR8qDH2IC+anmc3NTTseAyYZG2DUiU9ouqBzJBJ0Y\n8v6X+bIVqf7VQzT/qjXsQBI/FoNs9ULJQkCvmAPaYS7ZcDs3dq7Uk+cszANO\nMy7KfqtMJt0i+YBgz/vRRG9rzgKLZF34V6VPslEGs2E8+tQ6/VuJLkHqQje6\nUiLHDVmbTA+a3/g18MhtWhuQTubbpb8PjF9Z4ToLcpbobUnI/SRWU4Xp3Ov8\nNBBtg72k7+bGLDkawtkHViadgXghFWf2Zg8VZl0I6fzwmQGGVuYKfXcv8pMK\nGWzr+jurdbVuaFlViPxg1k1nu709uHV/ZOmtk0358W3QA0F4NRiWN9mr7igG\n+HXUhb5zJb2NZS10LfgiZ4IU5WnIiflQ2Rh/1KJP/q8jGENqvnJJHFcwSJJY\nq3ZR\r\n=ce+v\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDOLc+tJxtqtLyy0vPTLrcvdwmksCwpFqtDt04APuWwDAIgepNiNrC4l/JownOdhL3zpVFt/nzLIdId8r/NLyo/Uvw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.28_1573721235688_0.20865994179764713"},"_hasShrinkwrap":false},"0.11.6-alpha.29":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.29","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.29+b13f22d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b13f22d32b69041cc0dc0b9a938a06b10316ebf3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.29","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-3c5yKnD4x/ug0JmluzwWpKl72vG3bEyV6cr/1amnu0SxQz4O2GASnxSj3Ccz2+ifHENY1xwoqrtRsv57ej8q9A==","shasum":"d3f00528e2d4777fd0c0b012c3685904a8c7d556","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.29.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzT4tCRA9TVsSAnZWagAAiMwP/0//RU4ke8V3TzdP0nqA\nkm2F1k7LaP7m/4RQOmK/md9UKez/7NIjWwkhXsMXMKWtnR7AJIFIW9CMPx6V\npTRpDwV0HKLIVDoYjalvEEFMRtUOGEKhMewOPf9WJQv9X4e4/Ch3NwYexgAo\nFqw/KoWg6PqO7CmbSe4yJKhYEwasQalaIpqlf+QjgsoDS4OZ8mdc8+hvIopc\n73thaiwXmkbfR45aqT+fk0ovQWNE4GhlGfAUJagK2Is8GkVLwgn1thexG3Dp\nDkGkjVAUZ2A/5/tFYLraqh+zx+7A4uhJ29HlNs5W8lAH/Jc8dDI33/pcdaKJ\nHmo4Szsxg9Y52DHvptCoAi5kv7RqmqumG4DcEx+41XQGfLZ8bdSXRefNYLJq\nWzMpXqwz88oxOHV1D+I6DEfzOb3Dpo6+Kmr67zNtJu6txvcTHt9dm35h97zj\nFAtCcv8WUwdBPfMFsm6KsRsscPIbvwmuzZAJ1okrXeSUzUPYeQHgb6nx2Pwd\nH6/P+VW8pWYlIzGhVE0Hn1wQKtabSWA14XpZ4tA0DgEgA1f49NR32fLwMNxi\ns9fyv/wIGcOPB6CW5uVz2+LMVxP9HhwZTARZSLmy/srBmrVRnBI4VzZalltk\nFI8Hie4MqJDigUqbJWG24mbkLrOHWMHvB+KQPEkdG0U1GIA3m1af1V6JqqFK\n5NDO\r\n=TpAP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBqs183J58793nr4FIVYiHY8Xtt5FtGFrlmsrZriSbkEAiAl3+ei7jgLKtPrSNyCAYL77JxTMRs9nOAmXeYaayXCBA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.29_1573731884585_0.1346750377318593"},"_hasShrinkwrap":false},"0.11.6-alpha.30":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.30","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.30+267ed3a"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"267ed3a4444c2d12de2a9a317c10e30ab493c00f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.30","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Ia03m4vEvJk3xcUo/puCe6aos9kM9ZG3QXooj36nydzLulo/EjXEeg4QMEaRhPGGDc7UkOW2bC1qzLcw7dDj1Q==","shasum":"732cc870c56a5cf7b842b0b3590270e47cf98acc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.30.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzT78CRA9TVsSAnZWagAAi0wP/RHSroLad+rk+VDPzvL7\n4ScCHpxdZg8kwB/BEiN5iLXOPkgQBZFFF07FWco5eKAjlM7i0D122fIWjWTu\n5ymf05ZCaypqiMGsvI1x22nbJQ6rmhXkfIqmJ1g5DASA+ZRuxHZ/d6CmCrRY\ns4TxbbhJEF0kfyOWkj85ER0l0duSOpjy6ytgsSbF4Ej9TAQaiWWThHCpwFVs\nJYRZShiXb/DobInEGLBeK6jWoMXw6UuxxpxYHrFor+LreC/5EwyfDqzfOitq\nWk6uo9p5mjqpKRZ7sspuA3Jt+u2uHRotj45rfip2CkOW9mSPoJx70l5I7zA+\nAxBIMnTrj9sKGJ6zFPfJas7REdUKXD+Og3QFPdZu2TX+ave3+9YSqDiEA7iL\n9YJmqiuAGl9KxCOlh1aYfU11bCS+U80dmJocgEHywVVLKwwlVAT8BBWGfBJU\n/xxP7UTAAiOVbRIU2J/NYGb+XIWXIQ18wi5V6h1C5bsGi6a/I21gRAT+m5ge\nsOHLiaxS33Glr7NzxP+fWMybuwp5hizwRNzjFenTo2bsQf5RUnSH3Fxhyl4c\n82JsYinUBEXp0g87ZRh2fF1HL6O7kLt9N1hJ0V6PWX27IfpQzshJ3Tt/9iqX\nlLYzCrR6yNXxdm6wpiTmHPONyS28rPEs9dyKqfSdOxd3pp8jevbcbNSj4uhy\n6K+y\r\n=WNJO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDx3ZUrVGik9PZPLg6xY82mg6TgE+1nC/Uyl+ZKE6//1AiEAnIqzeQlvlQ26EnsN6Phh0ITdct20NymupNWHpsXk+EI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.30_1573732092352_0.8587060889408051"},"_hasShrinkwrap":false},"0.11.6-alpha.31":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.31","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.31+1ae8657"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1ae86570685efdd8ba529dabb4cf9252223f10a0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.31","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-eEQUIPkcs8vysQygCBJWkKGogKLI7jM4OSpsK9vxZgUoC2ipmAIebWBkxiBbXZfAEVB/baKOu2DYcfUnF7+zmg==","shasum":"267e16ad7c955aa4b3533931cde1013303509d72","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.31.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzUIyCRA9TVsSAnZWagAAPeQP/0k0Uz580E2z52KfRYkN\nYDD/yjpWN9hOEpJOhgydXhtxDUd4s5cL92kay1rpKWqdr3gf0fmclQHCq1dK\nV+1ZziRJMJcvKYoj9L4TFNVhjuT3bvwPckqbF0t8C/Rv9O2l8jWh8SOxUnx7\nj8D5xxzZ0IchVYTwEUwQda2Dt2fYTyGgtV3H0HEq/qlRQoebY+GolYgjZmu5\nRpuciM+Ud8EK/uhLHS0xTBcHC0rNEP/GPUYahxPUCtihxBct7MkifQTxh4JX\nea1PsB85rnfGzfo5k4gZB+5IcU9PC4aiwW5yhWoilj/bOY5E6uGSSVbiI0mg\nJ8AvPIjUx6YExZyD0bgg1DqHAt1BU8xY4qrkdQ5AgknjDFDfRaT7GxUnQqys\nbq/MxfcihljMa90280ciGg7TmdnruA35VW+tezIrEsfYHA8ERrdzbUx2/RzJ\nT6QzsQHeUASIsNJHUi2mIygNq9gxvFghyWeQhBMbC4xdWhNi8BzUUQ7lOssK\nt3HVYK5sUk/eNl15LbVeTeR/e9uYRvra8bEYjnn0nZu7P/moFPHt5FW9zx3Y\nULMSeo7euEQ67BQN4eovrnnf/sp1IR8NE7nl728IXkdJuwZfc9jU3xH6Vr7I\nQEwe97wqSB4B78h4+0Yav/aRB7cZcmMlM6OH8LUc2P1G1MKe5R3OtdZpOOGQ\nyga1\r\n=Uvx3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDXdlVVbxDqXEmOK9cN3vEg++i0PygychTuQsiSqOFgXAiBJx0CvkpBAwoCJReCiIWisT4FMrV0TKi7VgFmfaT1rCg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.31_1573732914002_0.5540943098509024"},"_hasShrinkwrap":false},"0.11.6-alpha.32":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.32","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.32+230a5d7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"230a5d7ffcdf3edfe979f29109c10d6c801fcc43","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.32","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-UkbR3XWBxmTBdvIV5tQNuhlUZgwGhCrBCBZTYYcSf7ovlHpT8EdVlq7qtkAHlGS5Hy1AVqHhLljzV7XFJ6HF7A==","shasum":"b6fa818bf5e5315ec913152067776274ad1738e7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.32.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzULmCRA9TVsSAnZWagAAstoP/3j69DrWMoGubVh99g7G\nFTQR7RLwedfQcSz8IsVZq5CfsXxsut66A9s+bM0+yPbB0C8YtojrymBf6LaP\n8W09jkHqRTY7EZc93eYJiB564pNqja4Dp23wS3vJu8Fi6bSON8o16PBJD75t\n3MxrN1rbD1O0VuXAUUzXKvaAFvmfRWQESkPcUFEihD99wzkmA0vHBDHmVXjn\nP/AXFP42wRdqOhc+Mo8NBNTuvpQDqZmGbt5XklQi6il3vzzFWJrxdyLQgu8G\nOoUfhoiwpV2T8twjaA77vy30DStzKL5LhUN0VzUmCDyZ9GDnMmKtUubVRq02\nCMd2FItfi+X/sXYGLImPSBPMcoLvnVif5ky8i1vYQC9xlauXP/Nl+xzLFnx4\npZ4aIad5n/+Psf/et/qYKUemrIP0l+0T6EN2qiH1jSmX4OXgrCxG/Km/DVzw\nVaF6XGwleJ8Zqbo3AtulNpA3coQgRR6S76jPhTDuJMJN42vErWsVlsbeoUbk\nUAUpbKU6pa8EfHIKyMIkdbF/D6i3x76ZcFWuflYCthpguDqb/dp5BlNb4Cjs\nTA6G6mCDJM5Nly+imkugceDlVPTT1S9eeyUUjeI2HmLzq0wEkN0SPlWLgB6c\nE+DiZ0y7b1mH1BddaSy4qHBA5TS90m1Ty0Ws/BRgNOsobzLDdBx1xsNoOEPf\nGBVm\r\n=glwR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCr8+LG4eLzECCnQzPCj27OoRurS1P/NNiPWMn9pz+WwAIhAPBP1I7X5h5IzMfEp7+/Y3LPAaKCh1vtq8BB7684QIn+"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.32_1573733093882_0.19061606193543823"},"_hasShrinkwrap":false},"0.11.6-alpha.33":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.33","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.33+89a29a5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"89a29a54b8acd8b3151863b7f7f172fe96beeaba","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.33","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-EV+cyhwK6SLhmfm7hTWleio3PWu3zFIlZlD0OmvuJr/5F81Qylj1AN36CVmc7aLH9DldM5xyw/Cwo3z3Z6fi5Q==","shasum":"56ca20ae2373090568cdd729ccb84906f1f88b9e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.33.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzUWSCRA9TVsSAnZWagAAdYUP/397UUiPpq1m4FvX1Z6H\nBivxkliFFjS/kA4ok3DTQb1qTHJSl1K2h5Laji2ISi9c9KIIKqQjIg5vfj5s\n52zchLsjuCFoLGfcucOM5yAtMz+h+JZ2I1L2Ix10uIaL5GI4eZ8IFy2l/q2d\nyUx2gm83pAs25xfbZcnorkMKz8Gfoiupx394qHvreRI1s8FVlYj7pa0B4glS\njlsANYszornVPtjN+qgA+sy+O1qbOLwZV2mrsZeLhCZbAk4a60ei+ySIFuEs\n0x+cDp3YZ7K16BJCi/KY0MNfeEh7Rhf0SbruSg84ux9vUjk0ESyn//irmxZU\nc58er3sJnVrv0/vxx1oHbQ8pm84FL8S9ESydvLvz2hikPIgOcsJztU4x/KN1\n9IfaVuTx0Xp7ff/EO9Xh2Qt7EaqLA9Vf1nSmCVUFtj2ayhJ+Y5ifRQ2PVJL5\n3ujxCt6/JwLSv+qaUgEgyIec9GRfn588GhGVKqFMk/Qa8IZ+WqQnkL34s/Ku\nDrfBLtu+hK2vO7YDPXeP1wIdhxqm7IMEkLsCIi9MfVz190Xi/8nf3NaQvces\nsV4SW/qarkkR4zLzbW/Zu36dGOOKWJKLMvCKkX2+RrJL0arDls1X1XPrwmow\n48j2eIHqoq5Tr13z0GpqMFHmyBvXGau8DXZueUmDzqjJmppiSYT0GFjnBPjT\nYHp9\r\n=0c98\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIC1TF8jTJTbo7hJ9YN/hnaYGl0AEi2MVS8m7uAJLJlw0AiBig8pwOUur6A+jRAt3vBlhgyDtykZrOh6EiY59JEfz1g=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.33_1573733777803_0.6615967954743336"},"_hasShrinkwrap":false},"0.11.6-alpha.34":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.34","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.34+ae4bf0f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ae4bf0f2f195efd6b72259f5227d915f3972bf76","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.34","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-hr269uH4XiXGIorOq2WAsur+E0DuZQXuGUCSXNJYR9wWfxweaX0soUi9FQUGqqmst4FlbPQO9Hb/iTHLxJ5MIw==","shasum":"320d93d7efe25d9f012c0f9e022eaa5288d60c5e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.34.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzUXyCRA9TVsSAnZWagAAQ4oP/1LDOgqDugsY1DNImWvi\n5Ldm0r0Ip3UDVcPOznWFFKAaXI0MebDAojPAgmNzsL7JzikJ+dv7AhHC4akS\nGvcHPuQH7zE64Z0HhJBCEIJ2qdcFGDN2GCJUaS+SMBD41nVx5khlQSYPInVY\nGr4UfH9HitOcy0xHvdDpbIls57ednqHYZ/QWzUJsifa1CZdMlZ3SmviJKzx/\nizYdun0QSFMVgh9RI/LY/aYlN/uUddiC2eVovu+HGqjLB9tMU/JO+cqpexE6\nqxcUbhLyb4Q8npM7pC8CAzmj0Vn1Rl/JALb7Eg0wooNPuQ+y/VoRMeQPvL65\n8QqpYKF4QEbG6Ovn2FExqja4oJ/02m3KAtjeQ5VDQfdx1RHKgUxo6ouNiq1Q\n3RWc16Er4JOCIK7lBBDtWitulzHtJ7uewJJg27q19UJGXbSU7S3/A5rYE4v+\n3wD5I/yR+LD0ET8UpMw1fp/vdxFvtVN81nw2g7AIzMMz4Ov5GsR+II5Fkr4s\nRJ/oUslWAePZ6EsDegzmly5DeJH7SlV6709HCxd8D6l9Bi7mIfsuL3zATXwr\neOZeyqmt9WppFsnYTNEITMuBPJlehFKxQTpEThk7YDxwZV4mCd2ODptQxlJp\nXYHPENQ14ekBZ0O5wZ2S2aFUngiKu3ecvSniDWjTqG8dqqrRm8coCrxbZlTU\nkbOa\r\n=Y+wt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID5Suvqttbt2tgYetbcTT7wkpWiK+lQ4Cj467krbKtIxAiEAg90R3Ej9kg06OkXlxZX05p6qhvm6ISTlaQLTNswHM8U="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.34_1573733873955_0.9972963144013649"},"_hasShrinkwrap":false},"0.11.6-alpha.35":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.35","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.35+890eeed"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"890eeed7b4a935a7ecf5abc922b462d1e030f6e4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.35","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-yg1JUCncWqK/mSRZO802xTBmioYrMeP18Bfyva/eLz9jRc4g8u3Q0oUOX18X/29lB6dnu1/OF6nZz10UR3HVyg==","shasum":"9fec05d8b03a1bb94761b1c705b19040807bc0dd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.35.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzUdhCRA9TVsSAnZWagAAQsUP/j4xkabOh4MpEZ701gUA\nvpCAwkS1FnkkVe4dCvxb6sgH872IPPJUppU+N8YEuzgd7HNn6QwLoTMz2yuE\nL0LhuIUjiTPtrMcePvK/iYsg+8d/CJTsnXRZrSxlk1Ud+4wLYc0vZHq/FG5r\nCKurgqztHt17fbuS4lXqXyAihNBcO9JlkYjSIsi+oYyx/Gw8QSi6lsY9Zgfz\naZgkMNFR3TH00hjSnBbOoPd75X3dYXORZgUlxXqHgjSXHNSqevZEb7LHkpF/\ngKTvQ7t9T1RbNkF4oJciGP+/H9JcXIQKX9Lf0SuzYMM/zo/pxai7qDOyCKXk\nUc5EbPu8Zytc9SXk71+yzzdpvn7CytUupuN3z0qp9xN4baFnrvrYPCkyTUaP\nr2gjMHSb7Nla1dSmRnExM1IO/ZptchyGUtfjdsmy+sXJI2wBxSX346/t9iJ4\nGaxm8C/jRGRX17ilLILipTQ5Hepvooxq5BWU8tcJQLHNOsao0EbU4ccjO8KE\nxi3Fvw+OD278XYswyG0qR2+xrfpIxlerKwKGJaInkrcIqi6JvSyPiMxn1Cqy\ncjwSDIiukCQ86NGkDBDyvlWy+m0jyQZhhLRLVCJ5YWpmoZ8VtCP4DFo+Fm22\nOfYC5x78iI6NoYR7fQLfd/Lx2oEboxley+Fcpo2805AlW1bv46YKH/jBkIQv\ndp3p\r\n=79Ub\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHPJ9SDcxqSo+lD64xoWCyjcduesx8xp8/JzmZaTh0sAAiBADkIQ1pdPEErZCiAt16OW9KiFieQIK+s+c9FdX6K0MQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.35_1573734241503_0.1949603239860549"},"_hasShrinkwrap":false},"0.11.6-alpha.36":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.36","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.36+c77b5fb"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c77b5fb8d64db5dee7eb4aae3b0e089b73338455","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.36","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-jI27vtrKgs1WSulZZmk/pIzFG+V/rahn+LnYDxeMOxVUVnOgwnYK8aZC12ZpaIVzgUpZ+eWzn+lIQfy4oAXHow==","shasum":"ea0c5d090e671aa49ec33d7ea151ebfc37e8d6ec","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.36.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzUgcCRA9TVsSAnZWagAA59QP/3GkWtzg5t3rHFRDbMem\n6KNL4NKQq3LtHHD35nZIY5RgnHrxJcT4mS3OiIzzJiTZv82sUV9CzFnJN8oL\ng4RsVhMsnkchUxkUzdadWL3IBa5ksSxO/plzcG/EelvcfuOO6Lf4enHyGMfy\n2re8gm5iZzI6SgjPEN1bD4TQP1EFiNVRpMm/Pah41KUGAhKuf65P7erdlLJq\n56Yq1vzlROInOrf4tVfDAHjM+lDk6B4VEIy5F/CSPvaH+yaIkWtTwU9ZpX4i\nYrNbmlmmcYZQSbKGQ0uUrt97RykrrgOv4KFYSziDfCDuYugGE7cNCzRG+YWv\nDl3n5nCW00lGCW0sL+xKDoMzcPwEyenpRJ9ZRQu8pdJk/bOl1OD9vXCos5Tf\nxMPhIJkURyjk2N2gYuqUv4gle4IvQe9zlP0H/2mCCJwsvIjJsvwa8eosSWyn\nOxiJT3koaerIBhvRM913TZ6VFVS66lypF4xjVw2UrrOSXbiSXgvHg4feLGdm\n1A36HfB3Zx9R7L7Dxgyf23zpjII83udoR3ihtXxLLETrFxFCGDwOlIgImkYN\n6PrGXweRHxTp+uPjsF8ILQJqHslOteNssz7g5ILgBE74dbGgCx+pUUu8kbIW\nlkTf+CDiCsTKNFjw7mRk9lPa7jzC1eGs2q2uGP8OqIGTtnwxRowOBvbhZCEi\nUNVR\r\n=9eQH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDy9lM0NMCiiRFFEWuRWVaMA4BNgxQnXQ0AQunIVN81zwIhAKnkyPDXi6Y4w5E3VRE4NCmtACcxjvF1C/AxJXSHvzbA"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.36_1573734427993_0.6113791630284955"},"_hasShrinkwrap":false},"0.11.6-alpha.37":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.37","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.37+68da1d4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"68da1d478499cfaefbfa0ec9952a6f14bbf5535e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.37","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-DCOaYse4LGjbaRi8pE2nR5yPPwnK5E4nNIDJ+1dBm1ZxXsBXxZTaWYu65nx9q4zT8sjORD6LKjUtjIeEVCxEMQ==","shasum":"263e888fe02f317fb0487a7de7cbac04fcd29ff7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.37.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzUmKCRA9TVsSAnZWagAAV1MP/1w9CxfhYIIX/Q4PMA9z\n1jERDF9cL/R1Pj8aGDrSMxaidlJNRyCIrlFLrP16Bh3dUrLaCHwSTejv4/rg\n+j32DaJZyGIKDSPs+0UAFoJkhzaF2Z9S1uJVO0tWCLQaO19H4M9Jslt5wz6e\nLo6I8/CnRY4vKF5gBS6TdCsVgjwzVPtsWbLUCewzigbl4fqIExwmXjN21ygX\nN0knNg0n4yviDHdIup4s4SqjN+f8mxEb0QLLymXmatkl7Ylk0FeUqBkvjA9q\nlopYUXqwn4qRFRn/ZvkiQ+j1lWYPef9BqZNXygQFUO8W6/qjaSkh6yZ2lPIt\ny7Qmb1x17OT8NlXMSaOS2gqkw+LrMRs2Q23T1ILT9XBCr0s1LJk6YC9LtF7S\nEuxeir9m1DQvToPvUo6DEczg+qcJHfPqtKAgUiQX+iC8iPMV5lnGqQ7C2BeV\n29FWseztV0Wl7d7VeWrGV/APiqW9WEzNCaWtouLYUV32isaLHB+6vzbSVD0o\nlNTKZYyl7xZlCXU9Pf3LkuigffkkBQ7EDUNH8aLMIoULcEpsVn/ZinU5p1RY\nwAqtFwBS4+YTUU1gRFZr68o09X3HPelZSR11KlC+xDWrYOLyqRE9bmPXuo5A\nF92njTdcU9XA3Onagp6axyZ9a8a9Dcl6G/erEo8VirYPsdciHyAg/hbiF6va\n951p\r\n=KwmX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCxamj+1eZS3QO9f+cQRFdeoQFy5G2fuL6AUobTV12D/gIhAIaWVgpxlpq2rwFGfIwrpCIrxBQYnERyJUkrjK9Yfcux"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.37_1573734794462_0.9862091583348305"},"_hasShrinkwrap":false},"0.11.6-alpha.38":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.38","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.38+40d314f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"40d314f27cc83b0190119e792048bc0259671e76","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.38","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-7tW6y/D77q2MDJgwoTQStFwcnJsAX+K0TJ57u+9CpVQKoU8xzNZSvUU2tKWMYUAShw5J3idoCHa1kO5Sf4a3hA==","shasum":"d785021784c79f0a7421702b24d44bfbcb5ad694","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.38.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzUz3CRA9TVsSAnZWagAAsIwP/24b1M6SfTVCGrnh8m1+\nPF2SvNp35C4T6j5zNrIAjWUKQZKO4tmvZj6JXnc4YwNJkU/nTddsEuIFlryZ\nrTURF4y/yhEpwlYrMN5Xjr7aRM+Ym0BrQAvD3nBeJAzHYMrg26vS8iXOzpGE\nzzfWURRc/o99/X41hwjkdNKV1GT1cIheXmISgE9LnZOTBYR3BeTIw9jvJ7hw\nwoZVA5RHVl7Sg6E2XiEgZygNvX9nS2K0yMuFq7VEIXP5AHvXN61ihuUv9AFX\ngape47gJTy02jUV641SFfYxIuwxRdb5ITZGXwIlqTBpQ8gi29NR/5YOybcYm\n/s0ebfOsaXuNZSG57Qelm7b3miy2B3XVHrEWjU8kAXjgFWXeFshahPlMtmZw\nkdKWOWnOtIHjt/sJal17bAREwoUJuZJXnDYtK4k77zSta8d/U5BDtNkaAoii\nKsrC2SIZlnfT82jkp/c93jUg99McC4lvhi2rEFPUplo6y58FA+cB9K0dILbR\nu8Hz8tC4hekj4nOh3wM0hGvmx8pRpy7KRXmKvma7cuqaZCC7A6AiDD1j61JO\nLy5ZTBC0HwdliFXl+wepowH02W+aM1LtYfGMBguYSLmtIhl3mPT5NLCbcD1G\nUaz/MSAY2MpuE5uGhQgclT+hTr+Nw93Cl7G/hJ17XrfYTibnzHEwmLmYNIbK\nz7t4\r\n=OsKQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEMNfLBWR1HoAekpKNd4dkuhqIiSx44dYfsNko6cBQczAiBQrv8wWhLBhXO5cHWmMlHWhZdCQVSXZAit6g609wvqyw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.38_1573735670783_0.34798899801623007"},"_hasShrinkwrap":false},"0.11.6-alpha.39":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.39","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.39+a813b97"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a813b9722e66ae4e38126ecd6b45b1f64d06a73a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.39","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-ouZ5gYPgmAyV5zw+a/+MyZnSWroIb8yKvVvXBbxHo1J1K5znAkW6aGSR4SnxGoWVKE52spgt70GOzT6nJ0AkFQ==","shasum":"2f53a283838e67c14ae12c963e89ee63760ad3f5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.39.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzU3BCRA9TVsSAnZWagAAfKkP/2bVFUzmqoqpp3/dqgG8\nybBPL9+wfiyUW38k3lNb+FK2KjaPVC6IXYuyOkIzbITAkznuzJ+33cNWd1vT\np6KbOpCgYDMSmDzMILgVTqh0vlPvpfZnGYE9R+WbTQhJmkr0T/edBbyjRoE+\nKLjFRFmEVmWDz5n8DanBh6JxpjIEYX9ob7w9W/8NUb6NFM6iCkKXYPFr8I9w\n9EQ2BbY8aeMeFgPdzxoRdqJjCtNdwVGD6/1HI27sdLWRr3vZk6rGs+GMlSUm\nMeP2M+SAqq4CMwn8lptaCML4uqy+q9vsPyxH8FTEQabOcVFfnGcr1vqbK+Xo\n3bTpaHOb16tleY+sL2qF53H3tFmehD54jItCLSkDHOHgtA1qNXFU0KlTUOvC\ndHWd9OzxaxWXcJwQeK+jOng6TeUbwUuDxdkjv+sH64khCsrAsu3owWY8avHP\n3QKjZi9kby7LzK6Xt0VN4iC4sF6UiTVdll6qPN29lYQ4sMKAFRWxOs+dUen5\nt+XJzRV8aBR7flc0Lw8P3ER6rxFiqBGM6C8g/BO3jRvR9bvMbJkcDnDYlHwO\nstxFTwazHcACXO96fdmtNs4tpDZ1V5L2gix8P5Y7I4u7CQDjDfNV0Q8OUEow\nK1ejMn0D5n2YHnTtZHpd6eBqaqX5ps5tT+hdnkNbe0JzqAsa4+6CxISmTt4N\nBjYE\r\n=0AG3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDAabLnA6wG825PbzZ5gupWiTe2DP1CeHqRmon7QdBoqgIhAPzEuOFiSzdyB0C/LNO5vc7UE68Lbkgg4q2fKWMpqR4O"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.39_1573735873027_0.6154076722283555"},"_hasShrinkwrap":false},"0.11.6-alpha.40":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.40","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.40+770adbe"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"770adbebec2bc2c9008e3167e25659c1e2ed39f3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.40","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-C9k9grQSGN3nu3qxwxWu0Uz8sXHsND6rN9UnnRORwM1BWe0VxmU8vAQqD7tT0aXcmcW740VzPMrBHR4hJJjtYA==","shasum":"d68fbb10546625f7bc4945124afffc6514e82cf3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.40.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzU6+CRA9TVsSAnZWagAA4QMP/1D4b+YY55UH7yMX2Kub\nN1Azaf6rCVMFtfwdMhAyC3xV0YEfnlkNFjRIULZonO5CGU6LlhPp8s6Ve8Tb\nCjeDE8VqoTKE2XQT4AxPDcEG685Jg9nLM3qZvPF74Ddn0u53jZArrE5ToQ4N\nGkgtsgd2beuN5yrjKAcYWjTls4N1/2XZ5JmCtP+Xtc9p6op4vm1iu3ER0dsT\nJbUDZyydVuPXFKVcVIv60nxLt8/B5Tnv5H+8Qff9rW3LGDvIxekDiyowo4+9\nuOCA1ULWeh07mKn/twrUQ4IbVUfqkMWNeY2xF4lCJLqLfiZTqHwjpv+Di30V\nnnAD6pJ4/gFGV1El0MYkVHKWIBZl8pAKf07GELnT765w/HMKVL/HTG3ZrBR7\n5jqnVhMGCnPC5ffcZ9kt+mBgfWP2ip+vBkBF5El64h1fLwBzidQMxKnAnKnh\naRAA/ehEcKsXEX++z4MzZ5+/efaC8yilJQih4tIsFaEj4ZdVptoyRs5T5cRI\nqz3yIpgvEo3DjwEi6Mjk5vZdG1lAY6PLmTILLEpf2I41Xwf0sXtMefQSc1og\nWzhufqpIf/0OIRPXeFFw66XMJW5svhfvwzqjTQPsDWWuWVk7UGlW8ocfc8GU\nsFlVi5qiJlhq4UHNrM1y9Ri+KLRrDl17ZKdYJ/1ERcmNJXpwHmsMvGF07++Z\nCw2Z\r\n=r8t4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCcblP1oY1tF5lQwNK1wkdzNIUvyGYpzdiJNezyB1BQsAIhAPMMxBJabPYBJFnaU2UwXeRWcaoMJKOmJcpdkyCJhGTd"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.40_1573736125907_0.5255280694090705"},"_hasShrinkwrap":false},"0.11.6-alpha.41":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.41","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.41+3bc6482"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3bc6482f66e0e7e4683d070cc9aaaa67ccef4bc3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.41","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-GrujrVgER5N9ijrdFt8UvV7I7RibjjHCnBURaYVdcqIwiiUW7N39XI3Z9Z1YDdVt4geSqEJ2iQI4j8571M2gBw==","shasum":"585549e256c1f863078df22a249ec9e70257a36b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.41.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzU8lCRA9TVsSAnZWagAATasP/2fNkV1UEfbY12GPP3iC\nDRs+v1ZBH6U4q8retH3H9xLU3HgZfdew2mP7eQQ08+2dRXScKqEe5/avI2gx\nH6+EXTV+nAChiLgk2RDF0UaENhYu9p5BedcDOMzL3LCyG4VpAqoTkhs3opmm\nWBnd3fh80QqzybGNuEU48aHhZjLiLMWr2PXMCR15VR3idcpKk05q7WtHOFgz\ncKjxxav3jE2HIR0Y/37D/pVWivRAaR70qUPK+S/BR1EoqIR77UO+gaHdhs6v\niz2bAaJeL2/MZkDlXKoqj6lnKsWeWhP7WwjWxXy+w/6YyXX65OfUHVfxKQDH\ngUqNM4iXXWDkRd9i2uFmfxSdhfoOTQ+M2yopxp/TOdDolJC/dlHI97R4RcQR\nK/f87qBUomOJEGn/MzHK0XpZiFWG6FS7xHmcwc6tJlEklnDT24FbO+PBkP6X\ngwBqXfAfHno5vkOlQpGbXIiooc2Q2eUyBXytROAb119dBMHbBGZPj2dKjg/w\nmo1T14ifpj+T+VPehkPPfQSJFgYb3v8zJWIPfRGuXOVh+8auk41C2vKzGDxh\n6LZ4NuuPNPMqjfZW56bdng892bGFcr5jCsx8bgDt/I2ZO0wn/+4zzroxSCBJ\nFLCVHP3Av4u56Oh5ShjUygu9Q+WDBSn01gzUTpKiXi+4L/y7n26OlB165ew5\n+AgX\r\n=Roi2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDpFAucQXdVDTqW2M7I8eAboQW+MKOK+OtMua/a3OG3OAiEAwVImi6Tef/vIM4kDj8UyApbjQ/gdSKPWskHb4XjdjnE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.41_1573736228700_0.9553122882285396"},"_hasShrinkwrap":false},"0.11.6-alpha.42":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.42","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.42+3174c8c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3174c8c59f7b9e4ce23b2f383cc11144033df5df","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.42","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-UTzPklNTXbIAkBxhjcjNWDT1sJBuKI2pVjKFlstntckwxrAuj+aQvAmiic1Wxt6A+esRyN1mWB4RHHRSjtBaIQ==","shasum":"408dbc4c1dfd01755fd38be2639c961a84a810e6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.42.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzU+uCRA9TVsSAnZWagAAew8P/iIWGxZUHC2GpZzkYZwe\n0+bBlg8KTL839L01r28LfEIcBNg99/03Ch1bDbPkm5lvexoLqke/uzkDn/i5\npfEbJNED4UD6HBiqmaO3dcG5ujHJBKympUhraTv3YnkHvgbStds/t9gBwb1n\nKBq56UUdzLoeXYLhXMYHAeLjGjtdZZzpx7PAyRIcTn4jpCVE1K4W8Lhe8UtK\nI9IotcXerT8TIxYM5ewQD8beQr4xaE+dHk9AY9TXCsXgbVBre6I+cfmSXD2i\nHUQNGW3M6P8unbzFPs4Jgu1zKsvz5r0T9XQ6eheguS596ueafTtingmoYu6z\nnsIHOqVfZkdStc2G+uIAjJMuDEnylq6zrTM0ye/umnaA/TnGE7XiYtVCJavr\nP0DQzd4+fRDgU55t9i38CkH9oSJDHB3UKHE8WMsUplUB407K61gIRaQfQ6qU\njVo5IAqvnPiY3m/Jhj1lPJ5rgpeAgKZ2Mv9/Jp+WHlw2SYxmjIU5xfQasf3T\nqJ3e1UDYEHW9Vgrg1nN++IFi6qdTcMdGM54n5XcnchLYqKqugxmNztwEkivJ\nWKHbPBj8JCjjldZwmZMCSjlfpIoT6XCCqL7ONOLCzRJ70bluO56nH9wzyNco\nL6vAFJepITWKlzOGxmLvs34pyTMLDor3GQPSvWcemc74WIMLkHn5Bkdh5dNg\nre+4\r\n=N2hc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGr8t6RmI1nPpTgULQzDHD6KfHSrDz45Rfksgcj0A3NNAiEAqSigaWVfLa3KWh9rx0BXCIyH3iKJcUri04Ys1gK7IFo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.42_1573736366565_0.9211766098451479"},"_hasShrinkwrap":false},"0.11.6-alpha.43":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.43","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.43+5b8e5e1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5b8e5e1dd9a765ea731fe250462cfe67b23ab441","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.43","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1fjbrL1OSoq/OmoEn/+2WMhV6tzlbrp394wEA19VSL+N3aF915s+9oqdeZcQgOnIRCqXRKIAksdtoHIBvJomdQ==","shasum":"500326df773eabf2fc5a28d12c49b4e2326f2f10","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.43.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzVBECRA9TVsSAnZWagAAX3kP/20oTVHLTlK6co/pHFhi\n8qxyKTIGru1c0PrfW8c75cwNRtRETw7TrEVktVr3SHXtKaaRzFcZbLhmur0z\nkFCPqspM0OJYitKSDPigGMZ4cq9/OxiOngbXNUloIjy2XsqDokrTxWQvyklB\ntzUeMBqJyv7aYAeXvLW7oO29r2zsmsKM+KcSRRJJiL0p9ssBKtP8b7oAJ+El\nev7mBwme2Ko76OyWQGpeHS5qda9FXpUSRCf+lCt8FQTOjwZ6N/wUaXFo9VuM\n7XKopZBJ6otuDhBoyyIq20Tfd+97BLyq0VsULdD3U5Map2NhalZI4qfWdi50\nZ2YdpSqkn20XEWOsaqiH7PDwXWsG2Uz14jawoxcX8iCgl87Dfg9rg2PvkTQd\n9MdB16pjKrnP3Y7dzHH6xaee1LQLCBL6boTsOmTwBX46SrLXRvaYC+dLW10L\nTzKWBckB+jZNnvKoRaHQTXhPEjfhQHeVB09DFCxrlPSnNtaGgR/CbxR6lLZs\n0+V9UC8TXhsrC0v6hOXGAbKHNz2nuaP7MDAqNA2nL0+2Dgtw5v4MMhzAMoYI\n+6HCnaKtNHwQu34FL59VhHyFMNwXzmhCQcb3u6BJBv98rUQUzMgNy47RTalr\nGox04cecoLT8nWmL6Igt/HoUkjOlx2CvR2dYJoviYZ9Hm9+Ty7Z8S/xbYgc5\n6AwS\r\n=RmPU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDwNtuT6AvKv7bhyGod2ZRON7u/MSgoVMNJKEXjjgnUKgIgA6b4Aut2WflvzMMumcMwMfRUwLQngrP0ApzNcJ/X1fI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.43_1573736516307_0.2139080244158189"},"_hasShrinkwrap":false},"0.11.6-alpha.44":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.44","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.44+91d04f1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"91d04f1625f29a5112aecc763d13fce39fa77d32","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.44","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-1mQBYtqXhmDON+NH8WE4mRUpx9sx6D34ubtJ1EiXHSMMjrR7iwp3ktXI/kGr377/LqV7acVTgzDFP5TCNTRbcw==","shasum":"34a04a43604266bd03724348defb222d0758b1d9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.44.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzVFJCRA9TVsSAnZWagAA69AP/0+CdbQhpBtDFkxvcmQO\nQrRTbG77nDexE/LMsc5Ifv5e3Ostq57R0d9rEg2SMp/fxUxSJFPtgdFmKFCV\noVH0dU1D9MggDmW6Q3HMxiedo3bk2xGSlCsS6KYYE/78nYpdKd1IBff4bcDF\nSVBhN2jbFvKMdjNlpINcJ7hWC+r3tSFsYidAek0HDnmLE3kbqMFu+MpcyRLA\nQvVMesRUbcYIb7vfwQWoUW+OaO/BwPfsVCFC4Fy9btHYhVHU+8PP8idKKFsB\nNRvxT+t0P3rxdqTnzIHnpyjaMGSGh75UlnEYvF9Tkcdtlr2zk92h/8aXnSB1\nKOibNjm/KwVtjEogqgj6JHSJW/u1PAPeO/D3QPLF/uwzewEpsHqewOwJBFuX\nPMyLd+FInchIP9sI3heV8bwUl4njT24rnUzE5pilp3ougicDoGn8uSMK7zPK\nW3QB05Jk1dTzs8tDfy9tH9MHwMc8U0VYcKyflgQE6QcEKxoCIFHP8IT0XvxZ\nC9SPCOyaHGTWXbzKKRQ2BMVaif9+Pjdvh3bGQUn5u3t64rvKTVpuU7s/LMEK\nKgVYq5KNrHm/ddxpjMk7PrFXU2yAgks5DXs+f54ksBX0XRmL8vEsKDdeator\n6aSYwU3xIDOz7KcDAqYY0sq7uLXVUKBt5FudX9O3t/iJiT5gFayemZT/wpsg\nxKFY\r\n=1Wdm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDXe6Q9g2SVXv76s4O7K+mGIRZsrxghUVrs9uU5EuVfEAiBFzIGboFmuJKu4sGWDhGD20fHJc3WakO3cAJlRS19hzw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.44_1573736777535_0.20958262167672093"},"_hasShrinkwrap":false},"0.11.6-alpha.45":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.45","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.45+0005f02"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0005f02c0eca3e3acb83ffa2e21880634a97453e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.45","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-eyKvh9dhwRTjjrzNjDNf9rqxomqFkuyK7Mu2LLpVmfpXJaiEG2TKWG7XC55S1vFxf2wmeCsm6J0Q1vLdWrXN8g==","shasum":"bd02bda677ad4126d394e4d80ec4391cdbcd5357","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.45.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzVIaCRA9TVsSAnZWagAAC4oP/jf2AjWCbovzwj0haf++\nuJD8o2H4ByxgG9+U44fh79OyFg3c5mcgc7slGfgeTsRNeNx6/+vwPrzmPNmu\nvfYRF+oU9znjth0BcaCpiZHF//hWgZNwb8Z51b7KWklfrELwNWhKB3fAQhYC\nTUR9f6wpRnAjZ8ARkmqtomdntn2F4kSd85M7FtBLPHM8fLKAe80h/LkHrNmm\nPuUjJHUegVGcaMxzmMyTIPs6S+Z7oo35WViE4q6Dc7KNsP9tsb6hvBPovRWD\nMg3qaTVROofL1mKsa7/3f/CxkJalUz9GMkc6gykjGYYQdIZYANDXuN417AUb\ncI5yik3XAeYVLmr4t6L1Qp0q5jETOpGuF5xXhXoOOkpdUe7dE4uizu3BKVep\n7Mxo198Q8L8CT8gpRMcRqJ+JZGBq22pdcEJL1zfGe4XgueEWFv1cIhJX/WU0\nh3WTAnrE/SHrFZMR2oCGe0/TeEv9oGLG3xsiZ2pIMk2/FBaGGse9fcvM42u3\ngzlUd+NCObnEJ0077kpmwUwvEt4QkCp3mk2ftYrLDZ4XCeOydCXsve4norJZ\n3/kDXNjpyQsGGNPWCz/kZRdznTk7PjGNm+g3KPhVBG6L/16zgQjyIEGUIaoB\naCU39e//XcarX7HXfSSyAleg9bny5dCuDiB7F2RyPy4rXBHFdWHlIiFGa547\nbQF4\r\n=1zW3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDSXQfnS0BNA8DPK32bOIYclhBHWCo1/PQxNT/ZTD7GDAiAZT2wlC/O+FbKeAPHg4gaIg3IRro58grWtnUnqP5MJng=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.45_1573736985849_0.8051316567048512"},"_hasShrinkwrap":false},"0.11.6-alpha.46":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.46","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.46+36e7420"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"36e7420cd4c4aced26b5f3fcc983fd09a06ec395","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.46","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JscBaPw2NyByagGBVB/XLfrFdG2Fjng7AYFn47JxGHqsyIlOW/zz5yDAkKvnXDAGQxmOiUVAoqZXqgL6AsY8vA==","shasum":"705dafe25ffd5a96447783c6f461855d12ea71cf","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.46.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzVKgCRA9TVsSAnZWagAA3yUQAJThC1gs6YXj1VP/uCZt\nwCmWxXNSVfY2+z4eAdjfXc4ZJmLY51i9HinLHRZGQLPgG5D6ebUPXO1whz6B\nJEo167/21Vg3/ojQ6nXSOMkBiw/fEWEJiTAW7r+EqxdvTyeaM+T64hNShCk2\namhZLOjDEp/ol4Al0G8/ReR6vWg3LzsvFnLi5hKI/uglDgBKMtNqEvTb9uCx\n43rBDv5MBe+asAakFjsrJBdWP8h3wzs4MtNvDetsQCsI2Ds33IiOiVMPbs1Q\noDRKkbWBbmJswtkiSmE3EAX2ca0vkbS+kyVVRv8C6hGhV6YaxhByuCA6tZB6\n994q1tFuxYLKC9Hb8KV6/Q6gInV50s2XOaeDXN7QR38344tTMPXbk1eP/iG0\nZ6BKIAAaIaBs9PqOltnH4gqDHKSEXywWgQBNbxVnc+9ALVBThmKMjqWNZX9I\nqn1+YBPyreIu3XvisADUysjY9/mFE5ZROC9jez4+sw/mvxY/4X73KdFlPqHl\n/jR+BjPxMaqbzCPWfpzb8XZXY9HbbE/XZdHV4BhAEerPoXmLCuTi+K41/93a\nSDhk7l+o10AlUEHa4wwv5cPh9oaxucdRw6rxRY1ZfLo+oAHT4Cynub1tIrer\nx1z1BXETRQo/dU+cQt+piriH/lTTbyzIINL0UWG0g/o57QJlNTTZy576Vdw+\nmeXN\r\n=R2h2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCQYYnxoQ0mVWxTQSdc6Kp+K1+xwIDiHvfEtwsOGwqxIwIgVv9BKH95B6c7k9MqfEAjuIdvB+TLyPD8glWvvMBr03c="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.46_1573737119784_0.44710731960383954"},"_hasShrinkwrap":false},"0.11.6-alpha.47":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.47","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.47+5fda5cb"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5fda5cbba66682e4b501273de0f046b631840294","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.47","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4EEfmjKLt962R/8TD/HzGFGNEtlx1FlARx2dID2PjVgiijIfKT2nPYkaf+73CoxhraRXgVajYJouKTugJYYv/A==","shasum":"dc6e9606cf17aa4674ad52edd72c276eafb37b50","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.47.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzVMiCRA9TVsSAnZWagAABe0QAJLwUoeYgblxqm7BA/Z8\nusEMfaOyEQcdoEEcO1+ZbnerXo3GuYCaUHnm10oQ281VKHqKkt/QqwaSH8jc\nnQ3cfq+DJx1rVDBiXUkbUgrdkdOVydBjOX/QM5kj05fBId3856yhm18Jip56\nhPnx+CgIjio6SVuQ2YIaK2UwJ4py8snh/87eA2GPC3U8QvE7K6etdzPUBljA\nOblcLq7+MUItNCLT9Fz3tn7AI6dhqtitiMVJ4UdTaYSvk0RyasietowmMPsq\nKuHnTpFbZ66/EK7VeS76xdcAt2Q92NqB1JagVBdcLyg0zpAf/K5zgQAt6cfu\nj2diHg2GLY7FIEQDjc0zX9VToh2TidHZm1RPFVJ21TIY4dfqFvmYUIPc+q36\nqJNUukfRMZoyH0gYqUohUAJAEbo1189zsr0sRbh4CyYmN+9/ptAhNkatkHUr\nR9tjck/Icjkiw/Kro/FQYDJdNMPKMK5RpfgcR3fHt4ZDoXt0AiSEAIdkDyUD\nueIVWauGQg78Fe/X8U54JyoDt4vIF279F/tJK5s6RY/PX+VAaaL7nrGQ32pP\nfF3mpmuaGnxFhwIlCJKszwGx4W8/YRB2X9PX0kV9AqjMFGQS5GOMJyTGZmHN\n3rVN/vYhqfCnEn9SLwIF4UMjBynOpmnWgL6Dz8/i85lA7EpQjDS987j0JaHd\nHgvR\r\n=ZJkS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCsDQqlNpChMbCz3+OpWnf9G+/GlECAEr0VcwxbM46UawIhALzuGOISLqPJaJ6yvHsC4cFdHgFnL2USXIZ3W9ZNBXc1"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.47_1573737250367_0.08809709886043948"},"_hasShrinkwrap":false},"0.11.6-alpha.48":{"name":"@react-ssr/nestjs-express","version":"0.11.6-alpha.48","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6-alpha.48+85607a8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"85607a8dbadb61ee3d6e677041dc169f61d4ef5d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install `babel-plugin-emotion` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.6-alpha.48","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-17xZjyV7wSF7q3gASX85y+bBaWuxw8MxliqQyKrAo44QE2lGSdUHr7pkU1JtMlUjwyeMotg3qU/dkg7mKdrFyQ==","shasum":"646774129c9fc793b9030cc90661543d1007e27e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6-alpha.48.tgz","fileCount":8,"unpackedSize":13624,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzVQHCRA9TVsSAnZWagAAZVoQAIczSGyTnpOs1mJjCPW0\ntKK+M0xHESmGaVAgkILDvQSBxVkL4NHBanuVyphTRp4o6GKNZoMMJEuAD7XZ\nN8BR4mhSPTg/X39o3oj5FFmunJFpJwRFixeuZiWwidJZkXXqIWSm/4vKn8TL\nLchQlEIMyL3/8T8sie9l9RWmbc/7ImMFQaT/z9DfkG5Sq5rKom9AwsdFEHYp\nuJQ4rrCBTza0hdp+LdKGrb0k9lGI4u1v0y86fhkL4JuMZJwb0rJWn1VgPWbo\nPsPQW8yVE/PeTO0oxBxc433SfRltT8iBJO92J3eirxFjASk4e4+PFOV0FuA4\n4EdIOPnJjTZ1nB0aXDXmLwfSn+0XfAuvvEChMJ0+9DT5gXtoeEMA5hUFY7ls\neQdwMstPvkdWmENsFJ0+47lmxDR5UyxJYpfmb7P+3Pnu0pVlpuY3kz/7bRC4\n154iqmaqx5Cj+O7BMpFzvY/6H+i4gyAHfOnz4EDEnN23k5OAAIHNUQkhXsK6\nHV6DPELI6dnMr2oBZ6fVUr0xADosxLLNBuGqC5kET/USvfHcdcMd/SU8DOeV\nwUK3THCZ4svMFvjLjD/3rlOGAw2xujBAPDot6Gbpv3n3AaxeT63AdSGJVLpP\nUQVNou2ws/0qgMTnUnVJTYW3scGKZroGQYtE2OzjYN0U9sxC9B33TPSFg4eO\nIhVQ\r\n=xZwV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGA2eBwZGcl6XWIllPdWkhhDHwaqHJ6dxsuNEzCspvbLAiEA2wljmUejwxz3Rcl4CfDJfHfAF6cXdpKM49dOuh6D/Rk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6-alpha.48_1573737479582_0.5867893252766334"},"_hasShrinkwrap":false},"0.11.6":{"name":"@react-ssr/nestjs-express","version":"0.11.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3f0045cf0d0222be3490f6ce29b9c6a87a59b7ed","_id":"@react-ssr/nestjs-express@0.11.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-eZD/r3CYnGlrCHyeFSN/0Z5avvvLLacdM4DiDLzwhCJ+DUTVUJDjBwOn8l19knib68bnKDy5HcAPk+2zfs2kiA==","shasum":"2079475764b366dc3786fcf1bc5a359b2c398c08","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.6.tgz","fileCount":8,"unpackedSize":13792,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzVdwCRA9TVsSAnZWagAAolMP/iiIxFunGMrYBYT4fPUA\n88GhVmVxCd7EL4v00DSP/iizHmavtjTcb16u9Avjk28NBWbLEdNjFQGi3pcC\n7pJBcRN0RUd5vKKGoEbpomlhdGCUfqP2D49LxqVnFbqtB2+Hyv+j0e1S5vWk\nTghSHhfdZAzhZHfs2/M8+6PmmdH364/sgHFVr+YI0YDGOOt2N9bbwZYXaGJF\nMx8I5TGKkQAJo3WMcUk/BxQq3okY1DrFPnHaKgHtAPjwDgQmBXCisvhg+i7d\nU5kXXn7uTdOcDiAKhQr4Nze87W1tEFMSDLkino2FczFdo4hxJItVhBwC5L8c\nbzGmg0DtVd1AkHl/PRu/ce37i5Ww/yqk130qQlfa0hZ6RoenOs1wkU6QToIJ\nrGnLn6VFOVqLA/CJIunJeBXNVMe9nB7xQi/ELmRBi7VaBIrSZKYBLoW454GT\nhDvzgARCFR+RYI2vHZlYFiNgEWU0KvExopDJixEg+Mjxbmsl0y18/vkCjSOT\nbh6PQ2eammqz71dgusPV1+paMoKeF7LISXnUdhHr7balRIfeuHekmWXKSjs/\nySNrveodN0jPzHc0DqPeQl8WI/FRcT6GEJBquLKksLUwLAOmhJvefXzYQ3rc\nThDqSo7mE2F5mqoD/KfarYahkhnGcCiIWkDCF9iNH/BZQspfNG1tdTytwBjm\nQqPa\r\n=v0mb\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGURietCWqFuFtLgxs6gwL/FWLVBbC4ymWZSShNs9C5iAiBgvIVnwZnuYlgJECwRxt0gUIV3zzdMvNdMJ6zuCE7+ZQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.6_1573738352459_0.11493340186296042"},"_hasShrinkwrap":false},"0.11.7-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.11.7-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.7-alpha.0+3eab5c5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3eab5c515a36144eb532e1a22b189f028e39ef88","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.7-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-K/YholqgZl//7OB271GXgMTs2Xr8oR+IB6EOGzWoE4GyIRkOdc7xzEf5KyGC/mGldF/8B5NwJjbua5Hn4JUl1g==","shasum":"fbcd715df192d29f702742504ed1fd775e05b859","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.7-alpha.0.tgz","fileCount":8,"unpackedSize":13824,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzV2VCRA9TVsSAnZWagAA++oQAJoH118wUUG7D36NTNmI\n6AXYm1jxAuSvPFq6SumyPFi7EuNAiJntkr/JWPPQWmvAayT8e1Gj63ZG1D82\niON4UOEOE4ajur7/JjwKRmbNXXOYq9uhW8yX3KyZdEz6X01WnaonFQ419d8E\nwCOLYpw5RlbUzlh14QcUcHHKxL8lExeRotYR7WIUEWyonwxA40B6Ie88LVxC\n6+iZ7NygLJEGrQds7Ml1G43I5NAmUXulaGM9evSclm3T9QjZPwNWiNtakHHP\nyGNJoCvheBzG0JmYKO8dnS9EW0vIhjQX1SydGj0m5XOAsvGanYw9//Uf5A/j\nLVxngWKueHPIDhsNA1hMVFMitUWrajqFJ5YR4kbn9SSuarORPEY/uW/G5Sf/\nUm6T7443NdurYDwnBjauuZGKJZ2ziPTiUgIM1Hx9xMlVAm6ZzzRPtPWq1a4F\nKKggxud+1TS/5Kn/vukcR4sPeWAeAEMzw59LNvyqZZxZuZ2rPWuevmxMtifr\nRm/FugNLZZrfPjrBFw+lSQGAgTvArEmoXH1rxZPwA5n2D1siqDX8Q6IpWgSH\nItwDXkEzFwFK7Xa3G27RO8y1J2lhc+uhkWIJtymPmDrrXR+ApPIeyihKIvSb\nuLZxBE2FUTUd0usnst24uyuXc1Yc4SQfojIm0rGuSoAn1oJNhydtsu14Ph5U\nnyLh\r\n=pTh1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF6kurTTC0Csx7Be7S9DkXxvu3+v3vCeGExBVY/Vg7+xAiEAsXUFjoQYEyMB9IKwUfrNcZDo8tBvkWh9upnUvt/DwWE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.7-alpha.0_1573739925169_0.32477198859739276"},"_hasShrinkwrap":false},"0.11.7-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.7-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.7-alpha.1+01990d4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"01990d4d518bde2865d35b4d6513805b0ec10e0c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.7-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-DR8k5XXDljkJDPbJp5YDdxYRnC+0hufV1ZoRrK826ijZl1YsLI2CTmqxFjWq+tKZ5fmbnAdjUnf0Mxl94hRmLA==","shasum":"36fa0503dc774e881bad35c08345e3b9d55a44ab","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.7-alpha.1.tgz","fileCount":8,"unpackedSize":13824,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzV8ACRA9TVsSAnZWagAAUzgP/iV1lqWlEe6/TWFQrfIX\n1HU2/KHC3RmoGaHYrFJwoHgi3U22g2M0fVYBkwIwMDZT/eCAoAI42TkQ7ocq\n/QYlrTqAhBCUP1c+wVR41WBzBA/M+fwsZJ/fjEw++HRD+erK63kaD2l6Z9OB\nP/TdGRmpp8K7oYXx5bfJCsEKCMGhIc6T7KQuoEVeeX3FA2eKW/dqTkK3Xtsl\n8RpsebsCNmGxG9UeBKZ03s2QuyRCOMTEhMXs1g03UHzKjyVhhooUjQJcKIxw\nNy98D3k60ZGT+VTidNy+RoYsjU8Mk+BcU0sdxORUJMN3T/3L2iQpLQzA+p3I\ndoKia4L7bZsSa+beLzpDhfJvlDnDzQXqYJyVf59crqC8r4hnYRcKV7i0Funf\ntpyvJyUrTiNA0mFdLmI6kOHd2iPD+3Lv7NA+IkCrvA+hU9h1qWS+JXJnlCLt\nnhX6Tn/BJE3tlbJp9iXNwheKWYNKjZTRw8trEd5kKBrcyx9b0fqkugUqt4bj\nJetFTt2XrKECYvGRXZDxYSTvfVhOQUcFZ+4HtYI+QF1Txjtendi4kMcUd0L9\nN4N2m5OJQtD/095ry5hzzKCz/KsoboWkRTNoPMzMQEAc5eh1gJ1oT07Uj3/4\nVy0yxwkfHBVy+qQ9pr13MoOBcEHB1il/7BekJbsXY8wqqg7cmGIUYUEwF27W\nftlN\r\n=0zuQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHDaS+LxABumMuaye7W1J05+JVNKI516WexgbyoxrS+LAiBZnE9JbnzYqLUvWn0RYWE1rQikSTyClheWyUEJXXkI4w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.7-alpha.1_1573740287946_0.8809659665377367"},"_hasShrinkwrap":false},"0.11.7-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.7-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.7-alpha.2+5fcce6f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5fcce6ff6d22350db115c6ec83068281cf90d947","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.7-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-WX2fu/oRj18e3yOv8hQU1SBQ368xMG0Ama7Jnj3uBY3jggPRKnSjNLbcFSSI5+1qxRXd70t/puNMwSrw3eDi3w==","shasum":"aade9464c582cca829bca066cdcbafa104e9830e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.7-alpha.2.tgz","fileCount":8,"unpackedSize":13824,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzWNiCRA9TVsSAnZWagAAIKMP/2b3DdTH5qzGypCPEv5M\nOnRnCSN0WAf13Qv7agPoln6WHWTAGgIZcbrNqG8x6inc6oXFKDtNDuYYAvwu\nzjIszmoSF5dbr7hqSgkTFFaMA/PwR1/Ts2WfCZwAwyIh5VY6PZACnrIbuAlA\nhx0zeRDyG3ts/hl+p+3UTApe7C6ntVFvMnwp4u/D2YxZkqg6kCHgJCVQkmUR\nD8i1AYaFjXSSyKGH69dyzKv5tdG3LFs6KzpdBr3ZmV+2AvybT7uiHF9+lc6G\nzLBaMiGK0CS1MtKpIhc+9Dm5Rs2SeEdxqu9PAni+YwZV4lXOkBXsgrJw7nnw\n4r3RHQT7Rgcr2CIhi5W+I0+IHKV+2z0DhO4GbSXGcEn4ovhgzf8UJhj/+Ik3\nYq5rth7UzYw/+2SqIaFt74m0BQD/xr0c4rsWUG2t0fliRWU01+syViabUOOl\nX6RWb411+wYTcapura7/PNuQRGRPLOTt8+4Fyo5/RQu3/s6kv2TU3TtZ9Dw4\nOxJEY7e2X7qEJVGjFapU4XxxYALvIJ9hRbvaMLVwuJiBnJ0llFwAdThe1+VV\nFw2xQmJ8xQqX+yROH44Kv+sM7hOF+MeOrXv9UR2F/K1XYMZqQhikHkUeXBpa\nibh+ZqqXu8eL2O8WD1PyKkBfVGk16NXhkuPbQaCpw0L2WM0UsPd7caZnFUc8\nNapI\r\n=NRo4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIC4MV/RsaGHt/uU5GsSpPtbL8IhNmQNV3KtaKI2T33T5AiEA6QACLaHbNEM8os6yr1d9z4/Ck0DmIsGO414KsMIh+yQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.7-alpha.2_1573741410289_0.23736457136508338"},"_hasShrinkwrap":false},"0.11.7":{"name":"@react-ssr/nestjs-express","version":"0.11.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"593619755d9764b7ad8cb70d9eab814ecc1952d9","_id":"@react-ssr/nestjs-express@0.11.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bJN9eLh6a5qYN8GgVD8I2n8ZRNdI6dkOuXSJlsVLiRIHYQlQ2BL5i4q9529PIEENqs8WXrQaW1hiLrF6BOXKFA==","shasum":"cacd317848c936b75cc0b0c99998a6650098819f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.7.tgz","fileCount":8,"unpackedSize":13792,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzWPfCRA9TVsSAnZWagAAe48P/j1D6AOMY/9AzrQEngtb\nOzIOet8GM+fuC81x7MxIhwawu746cS8JbHBpb6yQUUFygo4CcKug6pv3lol9\nfL+VqzCLHDIQZS8GlqJYYjUEa9yC9Kf2fcJVmTrEMSqim2sD9WOkApLkajJa\n+EUE9oOGJbGsWeoZXf7sNkQCIpvzfpMKqaRv9OIi1CRl5N0TUYNMGMkLZV3z\nHaC5Jr2oQwcetswaNvJEMf1X/fwPUbhGplr3SjICfnU95ADUb+p316Rg/XIs\n/S9SFV0U6DZBxuIGffVtdLJe46Qk0AzTrjzICnR0QGG/FzgCICvKj2RSqFEv\nW1Tg9EKerjNxU+jsLY0kndOiF6ZTGU9/piYeCJ2SSqz+StCxUXRbltDz2AUx\nHiQfkejOT2oghrBgBavDfET8bEjLdHfcexjFHJpa9O/bpyM0dC4sujxLj8uA\nlWO+B5VzgMQ6hvv5ZsUAiOEMbbumTMXlnF8VMb0sMMbr+O2jTXf7sXMFdhJY\nTm7UFwmZDwO2BpfKf1D9MTlsQbt3b+n2cufDEKJxSQz5HtBu3eak937fBbzF\ngxvjnSHF+uGofztL+kMHzE92MCm4aPuvVS9j6hb79e0NRvc1acdZ2KRKpVyE\n84i2MTXQjwykcjKr8mTZsT/5MPGgXr9vZlTOOPe0YhUTXxum34/SiAJ+H4FD\nvLeD\r\n=mWTR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCg/WjwY9temLqgGdo2d8nuOhO5iJIQvI2yJghS9hH6ygIhAJGNMJUFAZ6d+e4TLNmmU/QC1OhpTA7OMwRcMgZPWxYN"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.7_1573741534977_0.4585970232698071"},"_hasShrinkwrap":false},"0.11.8-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.8-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.8-alpha.1+9bb953e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9bb953e15573baeceb72809bf3a2d8f66dbc4ea0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.8-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-dpRf2VscJTroarrr3SG9NB/Pyi7BWK4aVEMyNYbcOHvQudFGjK4tVKZWMNQ8/D8Q3wdWf6DTcRpAJ94wpi0fFQ==","shasum":"c4068a553ae327e591bc9ccfe2dc7521c87ea299","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.8-alpha.1.tgz","fileCount":8,"unpackedSize":13824,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzaUECRA9TVsSAnZWagAAf4QP/3pj1Sj8w7Lu/Dc5luuy\nObsZigzLYRAq2BgNVdc192FX1H9LmQBEnf643wg/LiRJQkS8j0Yn5Vo5f9DW\nIi5cBOxcrxq88AzaetJ3d0vWCKRKu0rUm6ZF9TD5xO0cz3tS+O6TElBLxIL0\nUYGobwRkxagKmhbYFC4uMDWg9Wb/JNu77qpFHpew+tgYj/akFCPXKsNoxq0C\nMCPK5FTeUAkJCkvEMfBWJad5VfUHBPEu8I0PM/laxaBHdIx4FiOpk/UFs57q\n98fme9bKDePPv/h8Ldl3RLd0IvlCx2NnVQTXRbq6QrYSIIRXuh5y4ol2zihR\n9YLl+4Z/BQq6DJ7NBO3jTL6hPiFUXlb9s5V2ldejSb2jCjwhfNCpwF+nDjnn\noPT8bX8t13Mw3F+9pytuX49QN8xw6msAOZJs3q0eHXhK1uubuRz85mYHSmoh\nmvdcF2Khd/qQ+Bn0bYNpK1cjCCvysNW8X22/yffNBduubt/mFh7JWCNH9Ndm\nA2nQdc7PDnl1HqJvv51kPn7fqdFhbczES8oNjRhpjn6AJTNhvAU1Gdf9P+Mc\nwdvfm6N5cv9DiO2qnAKum56pb+46lfxgqLMPMv82cGn3bhXpUFY4cG8UMii5\nf5QWOx4GP4DvzpPpxLGGq8UUqlVvyBWCDZWpzjuFirOt0UbYj+D6mniSZ2GN\nVAjq\r\n=f6Su\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDKzkumC6rxOJxqrs+LAjOUQnec2x+OcYcdiUYkUZI1sAIhAMQtTDZLOWRc3+auyopa4Ii9mbhwkVxENMMHEoazFWlF"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.8-alpha.1_1573758211508_0.9795375200077399"},"_hasShrinkwrap":false},"0.11.8-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.8-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.8-alpha.2+9aec603"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9aec6034c61c1fbdbc77eb08d52ae544a4f96a77","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.8-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-9q2gXaXZChP9SBzMiQAxE0wWz3W3dds3Pkn6bS7lOFP1oPdbvwgol5z5zQwYzascbKexbwpXDf0hzAMXeWbClw==","shasum":"1f3452cb592ebb1a4e9e28e3e94dd7964b5235fb","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.8-alpha.2.tgz","fileCount":8,"unpackedSize":13824,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzaXWCRA9TVsSAnZWagAAoUAP/3hI8UxFgUXqvaHKMnPw\nmvcGCeaM6AycfduXfDtkT/dJeNs4rsCv+aUzsX3uIciqCzVlLgJlugxjsoGD\n3s1IfacxvFC+6pT1BtKQEzQnTnRNmDjPX3SdJUrJu0z8ik0hfr4oWLBIxoe/\nWMqmU6GmUMCfZkUXnaTCMo14CsY2TCObfnZ42VWYSnT1EDPbFbWiHCGReWlt\nu4sGjfRUB5wt4Zc0MhhfFMCX0EV+pjXkStyef9SGZsyX71gM1ytxsApRGqQa\nKvs0trggrPSJXagDxiiYwZjpj8AlBND+MByjQePVLR3XvmX/biLE4xJEXJog\nfyhvNM7CJjhunH6NPpwjEjIO4GAgyYrECcBxoLo4RRxRzAxbwzk+c+FS7JLj\nQt52DzMRWVhvOnd9siOIqEDcicG/5ONcWYw4IlMekTTn2YkyQ/LzjBD9z05Q\nA9lem/ihqsKBWEcP41AZZ7Ju9pSyYk64XcIENHGlK0a9TrMKZYjLpGndvatU\nwmQF3/QillrcNfRBq9mU87Yx0vgkrJUclQ7xp2a+EfsathMDCw+sBRvVqY4j\nQV9u7jOSGtrdYSSeFTr0/91OSNy7KDkxuWLpzLf+dOcwnE0zJNFQtOBi+fPQ\na0I31SQbAUzztE4NTZKBtYlZBjufwxWTAn5hMLgBaZUU2yTDuAj4rEqeF4jJ\nekhZ\r\n=n9v0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFhw4VhJ5Z0LsS+S5Dyec76twSsuNo8XfS6soNvO6sO8AiEA9G4xSx96tDv1r7lvO9yN2Cg7kuLL5OIcf1zY5rcwu9Y="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.8-alpha.2_1573758421910_0.8377650935118175"},"_hasShrinkwrap":false},"0.11.8-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.11.8-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.8-alpha.3+700eca6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"700eca6967b4ee0e2cfd745917b50019dce7b0e7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.8-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-FyOZefflXLPeQqWbuodRdSs7BZJGP/Oa6Hk7bN5W+cerkjBi5McMBSd/GbDzdDxxnBcB87H3OVsR7TpKmXLbEA==","shasum":"8feeb7d1e2d5f44cfc7f18ea8a547f6a012513cc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.8-alpha.3.tgz","fileCount":8,"unpackedSize":13824,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzauxCRA9TVsSAnZWagAAVE8P/jQ2PPqH9umSBWuXSSDz\n00g3XzHb07HsCBz+Tl2fZnuKjLRN/pnrDvqWtVqlhK8tmGLx1nFm372AcwB7\nsdwQbzk2J7ZKuLMndPipd9pqMS2rqV+7dn2a9EuUUH93kMSw/Rw96/DT7fhY\nX7NzQm01hEX5ifLgjFCeqiUiewm73EBmOtfbLpPEQgQg61/WtCe+gehO0V+c\nmJ8Y0QS3dk4uNlNlcY+Jx3jx/gXV7rhPgSOCUSafsjPX3gZ1gkx9QBL5SHyr\n8Sk5SsDIZmL9y6Jnjis8rtCW6EvrR+coG9q7Loes7PUOrAn882n8Mv/qQTUu\nIsFJu1hpuuWV4cHrJ8l1UQp3lwSGc0s1t8gllXTr/f5EzOA2QcD1jONyddJp\nY0vVz2jGNNWo4362/zzqN2HI7YNHWNr+cgNAiDGBJhQ2ZGhgiYQlmCTuJAPg\nvlnzGZvISHSmiEdYGhCatywXeiVxAHwPX5X2Z9RnLbA3qISS0ul84lGynbWw\nla2mOQdGu+G8v/KICRLMfjCKtVwWNKd33scHytVFCGJrZJUNQ23klBinsB7y\nEZm1BgJM6Xpk9/6GzV+2FeCCS/ZYb5qGokhrFC4iipAiMRXRKDAvtceNtxn7\nYKOIaAWGLFl4mK/tWwpBeYoV9r9JbWwxIZ8YzIiDhxeDTbY8shJenoHX/ITv\nLUSQ\r\n=Lxiq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDn82lEEQHAdhqQiNQJiI99rL776NhVKD7/VwPO6aPUYAiAzuWyeFHME30QKJX/Jn9PBdh8m0YoSt4M9HLc/5X/6ow=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.8-alpha.3_1573759920551_0.23298814699153647"},"_hasShrinkwrap":false},"0.11.8-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.11.8-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.8-alpha.4+9f45d90"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9f45d909d23080b194be097f6ec51b57133f917e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.8-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-xnKJU5NEaYR/+5y16ob+Ier6yiuk/Dkplw6HoseOmBEYu/2+pxZVtfv7U6Y0rpndcmbh/j/5O6De3NmfYlMDnw==","shasum":"e055a4b8ebac1e81428f19f40d7b71eb69f3bb96","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.8-alpha.4.tgz","fileCount":8,"unpackedSize":13824,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzaz9CRA9TVsSAnZWagAA/r0P/0WKyZjoMUZJE1gcSsoh\nhc5w5mNUEgQsHWYmd4knk0HGwc6yAHRuHq+idtdhbEvlNAZiIbEykbWunOtz\ng3N/l1qH0eeqZHk1zuX1a9ImLbt5Vz8JTu0/IBh+9V3bLSsoGiZGT0zWShDc\nD+f345EuTJhn79irBteoMN9H00fYmprE81mez0bG2iqADTeXhERpL4Vtpy00\nJ607Ybribv4LnZrdZ/sZsNjpruMPWlPbEjf+F+AyzOS90UJ5ShjWGc1JyDJR\nfCV4YSWWULINvF+fXJhkq0VLyJs4i2TrTQnBDWneQ+7AtYDbO/u4sy5+1zJc\nXLWwcBMQkYhG48t6TTW9MRcs7VCH4qJvot+h2H4MQ0LuGcq4h8FPMOr2K2Wo\n29ZXgY0rJZUcY/FEJUUcdOWnFmxdc8FMe2WH2icxY7oILniRtdMlEukmmYcu\n9yy8hQ4f7j2FlZnSAbXQ7R6UgyAUiOZcEiWLxg4akHANfZQVQ3uOlUAIQyc/\n0qvaYjfuvdNaJvIVtEqJNgMwpHLSiARU7yyVQflZiKBumgr2aq+zI8hIPhoA\nVwrLkAn0HNqOqYblgE1KjugrS2UhwCghSXTGH8c0DAv0quMQBz1nn7DnTV04\n1G74Gf8ysw+C3MvfF6HmyUu+yr8bjUkRZcaPtUCkk2K32426ZPrJczrCjnAf\nvWWf\r\n=LhhJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDYtZHVBn1MZkqHa2k7XXxQ/LvffDtJMAcC0gqePcAdeAiAMt/6rmTR127z97zc2m1lEgWsJqOd1i7IX/z3TNICQ6Q=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.8-alpha.4_1573760252985_0.7593210927304193"},"_hasShrinkwrap":false},"0.11.8-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.11.8-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.8-alpha.5+479212d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"479212d2950eaa2bdafd04d2ecd620651f51ce61","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n\n## Custom Layout\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-layout](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-layout)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/dynamic-head)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.8-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JH779X+Y+MRGbVOkCXJAuua8bRP2dttNQXnKMJIrqLHUSsMHRD+HhCvMRrTd1DNH3NN3C2kNz7R3zINBjadJ/A==","shasum":"3f41af6f4dc168c9214a889edafb6061d4e8fc67","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.8-alpha.5.tgz","fileCount":8,"unpackedSize":13824,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdza18CRA9TVsSAnZWagAA8p0P/jncmsWuXj3IK+QF4E5c\nPhjjBEmZ6fu+obF0EFIq7FtMoiShvFEH0tt75TGa9K3BmrpJfu11LkEE/e6g\nOuO8rfDQacWLQH19ZOV8k9hewtMqnXWgRk2q3xu0kMxtwtwtfejB4N31LKwB\n6hQ4Ie3Ph2PIgE27Usiy7kl56PsWzLVHg+R/mJ7vyH6gW1P7kQcwzxXOMdon\nf6qRNiKp1EAmB3chHYpTKrs4rhZtOqWPN0n+P7wjI1M6Wl74nlTIGzuqsMRZ\naFjeNKpHoT/cEmAyEhPHY5izKXh5RnC2+7MGse8dG4R5qbA2KyL5/Pfe9Qe4\noKnZg4A83VsqoBMt+6nNHbJGBqFkZ3yDKG6pUoa8E2RjwE3kBaKPktvKdMVh\nKgUyL0QXC+2/TI/Ov9NCXPRFNnbqbR9KSEQiAeAg22/I8oPReJH8MUI96Qv3\nLvkgJtrNfUFb0rBEoWK0NrCcxIm1geMgGnnZZYLgKo3qu98+cImOBqVi2Fjd\nGrDOj7Q4U5EhkXN7cTFWVXhAezovknc6wayc3dZfqZIwvZrE4j52xlewdVRL\nKmfOvnLd3H8Zwx571lql8+P1Q1FlfJhef413OZqlO4UlM0PMuxPkfpUC9lhF\ndH6CHePeKgh4gSnDa6jQXyWjpcN3hdaGY2P2Hf7s8V++EpzVtbPcj8AIxc1w\nG/AZ\r\n=Kx8v\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHI0UXQw30PLmSg77eiucKICCnh113D1qk0lYSFL3hEdAiAKcwJo1cekFKBi/rNVYb5uHG+NDf8zDGd8x8R8uG853A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.8-alpha.5_1573760379946_0.33921361857126"},"_hasShrinkwrap":false},"0.11.8":{"name":"@react-ssr/nestjs-express","version":"0.11.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9b87e32b485cfb1d32692cad0d1260f9bf68297e","_id":"@react-ssr/nestjs-express@0.11.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-G4s/7j/WWIupvGQZt1kE7J5lWXmXDC5IMYm+OTpFr5OskUFyqVgkvDfbx/uUUzKsZGu+vyqHTzrHnCASwSJGIA==","shasum":"22d7709c3e58381d4fed39af4ef54aaa38dfdbf9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.8.tgz","fileCount":8,"unpackedSize":13978,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzbBVCRA9TVsSAnZWagAA/DwQAIylkbxMkTqzyM/Iac9g\n4uNX6XdmAl7Dr+4nTuzRDMo1HDPuA2gvgYNyfCFlEf3c9vBkA6uJJE2CGa9H\nhntpCt2gL4KDTEvs1J+NHHt0WMzIOwWXV217bm3lVCl3IFcwuvwbh6+9yppJ\n7Nuw/TCWogPSvdBaFtO8xnFqCfuUqZsk+igeIIhUP/hYoa2b3JqIaFZ/hmwf\nsN+Yxjy7rv6ClXZQu9JMPmqp5Jt5kBuzDG69j43oh+ZaVlI161ZJeqyW80DA\nSjQIn/ItlUM+SajnYzGHEIQ1d6DkZUkVtij35bv1/d/M5oitHcV9eUKnaM4c\ni5kSPEROLqS68AaqMJ0Oh7b1KPYOk49P+XHiDNF4Sct5UEvu3HTlo2dOv9ad\nHsPUDrfHL+oAUcd6zsFMuICGK5xURF/ROfyNt/ksoNoV4qTdfbeSQWl52qnA\neYtDBXNnoddRAyUAT83FmSLNqqSDEVLlV94iBu1qOe+43x103rsnoMbaQi8Z\nEGqWSuxdnhoXPbHjnySK1q1pR/ji70S7019g4EjpKkxLJm51w4ba4w2kCtRU\ngrJqVxGhIUgkzKpfaIRSMVNFABn2ICTJEt4vK8Yg0Ci/V1pKDuUoUHK0iT82\nysGTA8E8DOX5EdLDECK45BmM7Jlk1Gs99pjN56VT35gYtpSXLq2cgocGy4/f\nOx38\r\n=sgiO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDZNXTrzw+qGBasQWKaOOKOF2IWpLJtwp2aohGTRnm4kAiEAsHhD2TqDvhMCEx6/2mo/X66gxotolQieierEQAD3xVw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.8_1573761108838_0.06451271531383806"},"_hasShrinkwrap":false},"0.11.9":{"name":"@react-ssr/nestjs-express","version":"0.11.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9a5b9091edc93c0bdac96d243d2054418b1f5210","_id":"@react-ssr/nestjs-express@0.11.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-15fQYYOjIgBbAH06jeZmNGwAJppi0tmNjlIQ3tzry5fzADR1FEpnJ8Y4y0CPlZ3uc9Bw3tQFLDv2jU7RAdKTTg==","shasum":"c471f4f2e9c853b0210bda815ca93e6155ac6334","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.9.tgz","fileCount":8,"unpackedSize":14040,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzbceCRA9TVsSAnZWagAAHnAP/35Kq3biQsN+9urP5QI2\nk6S7sRoEhwoQWlAk5VvE+dqVd1azo2qYTqyyEOodEVvhXDSRx9vAbSfo5jEH\nKjBustbQ5YLhhDU6y7Gg3eVeQXWG91PJXb1dsa+v2GpsXsajwKKgBX/XGx+g\nQRlNr/UsEDxCq/ZFDURszW69y8eWD8o16dRTze3hilJV7phQUB6wnXGpk9vL\nTDyjacysG0mYVNETTP0rvWeP7ZHioRQl9k6MMebyGTole4c8rdHIjN0YXscr\n7EtWQgFi1c4KGJhJ/+EmPmiB17j1dIEbqeL+WBBEaY947ZhDHS++ozDlBv0Q\n0D6z+8ao0LZhr1+BNW2erXjyHHhMWuQixyWoSnBl8OAw+eb1+QgTn87FyapH\ngXSYn+I75aex5go/Q3SIJ7gKHtWofKaFzm9EFlw0RuIwL9vF4q3b5dIKI4Hg\nl1zqoU7BYXT6kcoJuarxWb1OqqzM+kqO9/gMqqEzq2dEgN20ZXZVt3zsezGe\nYjXhb78+o5qv9IzpeuMzF+Xru8D976ScEHrK3myfdhZWHk1fHF7GfdngLLGe\n1ePs+Cp0P10rTQQ1YgvG1KFKKVEJsi59IfQwTK9V9EazN9jSVI98d8YdEuxW\ncudN0HEha5BPvrpIPkJL5HvYg6cldkhUpFqRZ7eCbDdZ+360WncERlNnMQo+\nWuaY\r\n=HPJj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC26BYq6EXwQlBqJUZtiIaElFg3qPwmv7+iTBKaZi1rUQIgBid+O17eFKtfVwDKIipY93V3aXEsAtfwMY/+WGWnjlI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.9_1573762845758_0.029262510038248646"},"_hasShrinkwrap":false},"0.11.10-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.11.10-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.10-alpha.0+aacb390"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"aacb390f9144898770a14353060ba5465394b04e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.10-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-rSrIPbPElb1MDEfrbnTkV/3RcWwynyzR8XpJQNUogeoh/aaqMz7Fd2kX/gbyXX8gtLp8H6t5gTfxGBKVZU0iKQ==","shasum":"51c63961c497914aa4932132b4d261f6277579c9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.10-alpha.0.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzgDsCRA9TVsSAnZWagAANjoP/A6IO61QQlqQlw5OXqiN\nyBDKOqlUjMbIDFXuI35j2n8d/Wz+pnvXh8/KbwhhRQd7SU0TqywH4/63Elu4\nBIAuVYQZxzA0nTc3cEVZGo0uALowkN3w4Fl/IrXXbmhyxCX5FjdHyn/YYOsf\nZUPJAALVm/1hWBOUECIzeGYSMASZJ8BDlcYdinyr38z5Ut6aibURhAPV6Wrj\nuQ5EtesJeNnlL7VEzd8HxRmQBK6WrLS2fOFl5A0Ez/iXx6RPzXX19gIEzAaw\nQoNqQ6FxbjF8Nbo+oapfcHR0nyXFCAYv/i051+vWCZFx/WT4gFp91BiaboeM\nvygtWI2BHMApXLEPkdAs7TiJ7ZGHiqmv0gVo4wqDQa0fd7fTdmKUPbcFaW7M\nWHyFsudxeHJZ0Fwt/pj3j2krU505fXQM5q6QGGIQUdvIB6AuDEp8YecwYg4n\nuNpxx+eGwIqjGv2rogM+G6VTUMgjV8lXEpzcc4A/qM36Vx3msQlZsa5Oc2fu\nbUbmQBwYdbvaWIohYkUcv5gf80CIXwa+HU1VrnmFjZZcQUmqIdn1ZmAgHTRY\nkhSXKFvS7DsyGrb/QYJ4sBO71a+1vMfKqwDdxxKS8NCVTanyUS5Ti44vcZ0w\n+L+By/4Avcp7OJn74lqAA5Ukmk8x6KX5kq9Cx6AZ4LlzPYDdZigJypNirTOT\nkp3M\r\n=SZNJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAXrGV3XXQQ53PtQB1DZwQVHSNXCAWhWX+dYPsvOvuLtAiEA3nevMZElUwQ4pyIvcPM3SOblUYE01djLxHWZmVR3aCk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.10-alpha.0_1573781739676_0.8488048104887507"},"_hasShrinkwrap":false},"0.11.10-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.10-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.10-alpha.1+56088be"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"56088bed642abeb79fce722a7a6b3326227f998f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.10-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-QqpAob+oJppCQKk9hN+j+SKJJIOfg2vdjkgdOtWPdmOmQCC4qulUjU40qr2yXh4fSD6pP10QLUm6bT4uuAP5Yw==","shasum":"8219750349b181590235b86dc51d7223b2c92500","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.10-alpha.1.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzgJLCRA9TVsSAnZWagAAvqgP/0Eo2huU3HzXyNTs84RR\nhPUOMjhOE9NkbulU1fValeh5whSZWfsQ1Jkqo8kuKGQiFSSTQ/Oo1z5wq3yE\npvwykVAcJKK6JWGBzJrCknZuzamNBqZVOW/c+R18j1LjPZ3RbDw1HeL9x2/+\nCsbSiNf3vkK5EioNy6KAJIo6RrvSOc8Td8SApWzXL5ZTEMZqik5du85LkyuE\nDsOqyYz3Jc/bMUGz4oexQdDDYns1STn2m5yCEiNK3CeiOKlo3yeDX5eqdCRn\nqMP3T+as4f4NozrxrB9Mbildrmj50VAKe8Jk0pUNeDSOFqxHL/u5t6KCsXCC\ncTnC55+cetGGmxTPOgsPmXNZvkditYtRJdDxKnYn97/v1Aqx5S1r4+aYsRrZ\n5a/9Kkxfr4S2XoUgj/NmIYDN7/fmbDZeE7zePNTlV8jYjl4eN5K9es6HtpFq\n9qr89qxQRKrL6jGFPwn1Z7VT/u6MbMeIBMWiCr+RpwyLhYvNOuN4NzNudHxr\nHnFA83eBvsHsOI5yhpc3MdwnOPDkxUH11DLmIO5tCK2HCn+3V9tQunJsjTnO\nlFftPenNaXOrkZ59mAG79GiGBlmLPIgtwQW44j6pn1G4ZqN+SoBIEDjh1obU\nFn7cs5h+tYjpwZ+YyXnh6Z6NxSSiBDMQwo0pStKz3QA1Jsj4EQz0DxvmBBnb\nRZa8\r\n=uJml\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFu46a+I8NZ2NruhUip80UHv0O5N3Euon/Y4x7Mj5jSDAiEA2IdMXAJ+CRctFQIRakDkFt/++owV25ZntNqpmbmoZr4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.10-alpha.1_1573782091101_0.1022365971075554"},"_hasShrinkwrap":false},"0.11.10":{"name":"@react-ssr/nestjs-express","version":"0.11.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.10"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e1bae8bab745dfbe7347f2127f8c854a8811857c","_id":"@react-ssr/nestjs-express@0.11.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-J/HpZaDPQ1EbyaBV58rBrKbUHRxRqbe3JJ0bm+R9LAriKQb0P7GiM0+EMb7jdd4ceIthtYk67vptJwps2KrvbQ==","shasum":"cb4ef375a9b0c365f387d0742ac392f4f714886a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.10.tgz","fileCount":8,"unpackedSize":14042,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzgLkCRA9TVsSAnZWagAA6vgQAJwj27G+qeY7DETVnKZg\n+LxkvjG4GzEaBTv4hRtxNm5XpiJw7RdkDpJETWQ1Zr4XUFVX12KTrW61gPLb\nXVT1O95IF7bkxKzg17IWe18w8ToSFISFfX7SWPPa2Gv6VMUurtx2co4H9M5a\n6rWV7n9bdmpc/xqf6VHFqRPWGyuk6NkaAwA9Cp0q+c3fBsDpBpGInTx4jzt6\njKUAQ1Fz/FWIW38E16y/gm0AKSCZqNbA27lzeP/KVxBStxkZBLAdSRTQKim4\nCTcCahCNTFzR+rYvVKEuKEmFmdnQTDyEzOseinr6UqKY/McrE/gbt/cl5ltU\nSHI1sV3TqVcT7RexM/DaCoM9i6gKPZQh59ylaPnpoOj6/3z9fzjQkHvPD2cv\nQDrXz+HeKvCh4Cpt64PYET8zXMWlQdryPUzU0WfB2dw16BGGeUspZQ1mgM58\n5VeXZyBK5wsDNp7jljK20el157nndlQYWuV8WdNQEbSLiKo2tnWF4Doo1Cz+\naIR/7jIU2S2n00DQA1EeCa+YzkwtifvaXp6NEICR/Eg/QdAO+cJVHBYyUeq8\npwRapEfrne4mDahDhdCCIhhFz5OPWymWeZjYkAzSZhLiHub2y+jymmWtZIqp\nw1v97F2/6x9z01Q9pCnRXbVpRRWF9Uky1rrR0UZWwg1WQ/M2uMf68U/oOeVL\nwVqE\r\n=3NHG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB8d8SikaG/Iszx6W1QhW2jf/ONdk3fmACwa1zR8T5SmAiEAsjKpOil1RwbEIpg2F2iBfPagCG2fWhinmJXdLHkCXyU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.10_1573782243781_0.9022842708482068"},"_hasShrinkwrap":false},"0.11.11-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.1+0045699"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0045699cd5ded447d153ab49affefcb6e851f170","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-JbWKHJ1HQc6yAKi/NkWJR1mzOHcG5xNGRV/ZWFe9/dCElJA6KPtTLnT4usV+wuLOH40/7QnguUdNBBsD+ef8Yg==","shasum":"bd9c18d6aeccf8e37c943281878f937b761355d7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.1.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzgpyCRA9TVsSAnZWagAAxM0P/2y/BQtIrcjovVf8Ew5G\nOtp135MLxR08nZaipHYbaIuhbSZNyCarfoBrm8MvoGvHp1+/kPAh+Pukxr14\nRm5ywYCNBjyNkgbigrLivmhFVhhSMRB8ep0HUXhnjBz6N0GX/aRWkuYbO8n/\nRFcwCXPKKk0bB9imQ5FSQXeuujAePpukHFQfpWsOFZxaXrn5AaYuZJtbpxOq\n4RqHHHOxAcyRC1dWggukB/a6QrHiM8Btm8hH/zHsaD+MEnU1TFmfc/W1YQqm\n1vxu8h5qifmPKncGHvftbeuFFR14XfVXwv23XtlPLzpJt4FQRr2mCaLm9Smv\nXRy69DZ/rG7kKE6bV4HT7nThRwuCPivszfh9uOKfNS/6tQEbxEXzqqkJff7v\nprwprVhXcWZigUGz2oQWvzdAvfENSHOTgqR/Otj8fMCd/G4Q8kA7uu18tPUg\n53C5ct/H5C9IAJ6TbuPuS2a3/5ZVLVluxu+LIydCmnHIRgqmBW2q29dg5aRb\nDinR7amUQgZRYgVQNVRqGQMqrXignw0W5DD1vwY8M4JheN9GubOoc9v5s/PR\nj/9bALG4jxVcCRX1RZZvJV1ypGkryOcMP4r7Qb08jFXF2hHDGQD3fiiXeyLF\nLJkVojO0KuoKMnUIJjq4dI88JierO8qF8MhtfIkeybD5nvjT6O/l6UvfGzCh\nmct5\r\n=CVza\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDQ4x8/O1ryLqKTp9NOPyvNWFiHDVLIt0Puxnb65lyhMQIgZG+Zz96NnGj5I1afRRaAzS7LaewFUGTgOIlt+qGUze4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.1_1573784178170_0.9174229248293337"},"_hasShrinkwrap":false},"0.11.11-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.5+fce044d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"fce044d453294ea0d4ce730fab1aaf3b440d4304","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.5","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-S7bajGgT7oXB8TNWeNx+htCED7gqaIcHgtgPNI7c+607A05MDas6LXK4P/CiG8KYcHrPRgBvqWUDvhQue7Y99g==","shasum":"5faf65361286543883774b67c665a88ba6edda18","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.5.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzkeWCRA9TVsSAnZWagAA7lkP/3qpJshgodIqsav2t8KW\nmmXeLWllkrWMIO19coscuraYH2YWvboluM+NKmIJuobaku2ZHfKxwuduoz/n\nXLn2HDehJZ1sX/T19uXsiW75nDMpXZpb3yF1yZ27a/odbuPxMOaBL3H+E+A+\nfu7teGKsVQO0sIfh6n/h1sNL261Ul9yYlfZJfFV7iIHIw8E5BBCMQmcJuNy9\ntYeEjHKLz6+6P7zDwN9Q3AnyposQ/qP2XVQaJHkyYxluL4XsB/dvClLgJQjR\nf0u4UT93KQy7ynLWBafbHwkLNm7fUHj4UXB+PFIWL2NQ5tjKGA8QMMhHmixA\nyaMXj/RQrIC8qjJ9OhXI9okuIYdwDc60hLoxjwZoYFOLnEtXb4VjK9GX0gzE\nWamxtNzAIZ1w2RG4ZsJR7u+AiqNVbChQ6SnE5W8IabPaH+CRaWkfUVXp1nE6\n1pJd1ON7HLeSW+/IV5neaxN0DID4I/Rzfn5Hw9+OwXmLCUNXKxPSDsHy+ZSb\nTFTqldPUur9Gx3LzfdxgkhASX924riO61lrIi8n5YjGtlQUvubhPgMSXIzMy\nRPBwmH/+Zwj6h3PkQ/hzfsKUOr3veWjeB5WreHtFJKmG3H9hVvDlD6r6Y8Ny\nqjPthlkzU3hLRHj2ahKMjxnlpaJrwG/OLRTSx1vEH3Qq3wAwu1tk374ZGn2i\nVebC\r\n=Hsx+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDA7rlv7CiHW/r1ykfV092Nyh/Xtyx3lbxFU4w3mz3OVgIhAMmA6GeiNED4PfTpIN4KnW5fpwvNXuxp6mxL/f3/2GCm"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.5_1573799829653_0.32477403315500686"},"_hasShrinkwrap":false},"0.11.11-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.6+4d27a7c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4d27a7c203f2c5c21897bde3b162b1bb8dbd4b0f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.6","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-mZhE2sZeaXhdnIfe1Yg3PRC+L6qn/qu8QHEahKxOweQ2gqHsP17Mn2HFPi+FahUNMNbtj/m0tD3oYD6TxIIH9Q==","shasum":"3d96fde37921e56f609cdf8a0e80316219700cce","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.6.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzkhwCRA9TVsSAnZWagAASqIP/i0YyK9Uwv8znkw4eSUS\nW3ExH01Y3skZlbG7AVSVURLq71qUfpwyva+kX6Cu54d8Rs/a56afvC0SzfxL\nEPyKeMRiAJx5vrv5+uBcGCr6mfzU19nDvrYsLNLJJDn8OrpQSPtw81koOu0m\nDtSyaejJ7b0/z4K4WppFx4pA7qX0A76z46odJGLhM4G5NPX/5X/SXbvwz8Ig\nwcL9CiQeaywqFtSg61mTzxBMY2Xj6sbHzJ9SHnm6Qv9CATKWmjB9FyLAaLa1\nQ9BX5q/XbXExLYgUSMg9y7k832qM09hHqDa2MyKp32uBbLbAw1y/IfFpJf5d\nPsZSDOUXBgPUvsOYFOxezpDZBndEmRK9T7mum9vyDCEr72WBkBLFj/n9vjuq\nB5TLoz3gl6TGAG0mbBZ56dYvzLeFVFAuNKAMOv5YSSuOCeA5hgefqjo/xJaW\ntY2GoHfWn2kwqCw3EFjv9HW+9OPnl56d/VmSi5BsLGXdTJHI7y4pjJXr4hix\nSEzXHOpSz5YRq5b5s32lH2nwaA8x0Tq/0T9jIqO+dbT/iyVVMImKKS4Zonph\n6reRvLehft2AK38Ta4SGRQcVw7obMUg3PK0rzCgQbfyvrMrbcDzV/4lIkGKv\nlgZ7jnjceCXRAHV146VLzxFABQX8h5FsBRT2ndNxzO4OaR2m95uxzo8e3f5c\nsx7e\r\n=Z3Qi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCi5uIOOSMeoxvL5CTQHWm4myf+0ZBkW5koNQ0UFVRxRQIhALypeBK/Bm1e7za7WND/xva0uwdf16LTsJeFYUa1Ucpb"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.6_1573800048221_0.9635899819957914"},"_hasShrinkwrap":false},"0.11.11-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.7+c80a5e8"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c80a5e810a29db5f9420f01fcb900a39c5bfd684","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.7","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-RqCNFKusMHIJJSuPj6Us/RVRxDiHV4dAsHbAyANjCbrhQUpEUv7ksCgU2G0LqynWU2TuONsj7sAFLfYWPNTUTQ==","shasum":"19f726e0e0035bd8f94e348a64325e81c21d5a52","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.7.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzks7CRA9TVsSAnZWagAAQ2sQAJ3RkP1MCzzK/Gln2p84\n7tgZ4fIMUKNvFVNtGI9mnCu1soETDeU6tibrdX7Eix1rRhu5QoWDOby+aSlv\n4YpxIEa3SWn4HU4G0GqyaMi9SeEVe1v4aXRTuiL4TKn6i8kqNG/mKhakGNE9\n6Adx1/kd3STS48BCkkPwww7E47DoNWzWtpUWCDGCacWNljn6c6LzVaFI2wTj\niYScR5k5jZV9k1Lgz7x9/QWihLpeboJcF7j7ffOFsP9bc3EM/b7KUIqTZjyb\nNoFRdwSPJUL6tNhec8ald+6XHuNcTBOo2lv3PJSwuQreobljiMvldKQ79TjU\nnxJI8MctvxNSnI0oV4Gjz4BqSshLmK/C/5tqKRtbfAjbAaGzs/kAmhyUMrHi\noxCdzm3TC3sZ1bFYG2rvTc2PzNkUspqOQPVMfh/lEwGslRx+7FljqshAE062\nSbv3uoXXdZ/SRO+2TM7rkETTI6kmNlZWJzN/WTevW62ohdc197uRdw6uB+/y\nsoaf6AiLQg0cgzwvDgbLVTUPfiaHDs9ACjIMl+mkWlXk4X1gqSfhG8Xk3ifp\n2hYtfqnLskGqnYBXzfuXoglXiV+g19Oh/GUKp7Wquu3qYnFgPEBhAN4hsFvI\n2L454JpiFdMDLiypeuRBHuJuNk29XplmTZkBU9rq/26lrV1slEgjsZGuirBy\nv2RF\r\n=rEBF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDMiKRxV7uT+sj83zbUUfuLM11a5C6VxWClyNXpsZDaHgIga258m2Nk6Hkho+8bBD4wK5yp6ifxJQIKQ0M0M3p+RN8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.7_1573800762957_0.8873741985231665"},"_hasShrinkwrap":false},"0.11.11-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.8+5f97533"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"5f97533634913e8d90647f37123894a62b4c8fd3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.8","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-k18MMfSnCvQqZai45uWRjq+WkpopjEoUCAScs1Usm2q0c6TMUz8808VnacUTQBURvPp+7cHU346Mtd7FTAytlA==","shasum":"f1a47ffa2941bfe08afee42cb099993c7abee0e7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.8.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzkviCRA9TVsSAnZWagAAfZUP/3CDCt2BmXtI0/nrRp7U\nbBGtSAYwcCLAhXABo5rt4xTAU97TS5F1WtCX8HdIyMHoGJPN0RpHwbjHRcDH\nIrHoLm2VAy/6Ade4xHwyU8WIr7/4wAJRbxkNUZX9NY/Hy80SU99P6lBP79vt\nMSTJUW+R1WTiV7qINElGYMmIQ3WPrlTZbYngmG1ghrTqH8Rp39y9PjOzdyey\nEuLTp7SCZ+2nhuSYjcTqq8+LGyfJxU1iUhlaHtGU7SRw3SdTA+k4QwfB2e3p\n6bzKgh2yQQvmCBGL25KYCzdOwJ+iGGfn8EzlPFmxkvWG/cTj/9xRiACh5OB/\nowtWXtqTLHlznLaYZ6MVLUm+uB+sCCMBXBl6Ys7GdfHwYPS0uKSSFEnFmcFI\nuu5CR6GzHFf4Quk62byALYgZh3BxFLmUIq8ebAFYiqzj3lfwe0er+jl+jgKD\nOvTQl8QuIWw2hdsfELX8OewMozq2pUCTdrcKqLY0EhEhjk+3wybPshoWSGQJ\nJh7dBk3/MCm6LSrCtfpMTPaV3VG5ADvT7kHi4JDE4uFZIfl+cPlG6qS6ZNDd\nZbxKdupRMpBe/kFGvUhY1thLAcAeNBAVuK4ukbmD7v+7OpSSAyyN6VwJ+5PL\nxR5HkgxKYxHK4XqaYfNalxHgVQM0gftUoontgCZX4849HMdf2FJFryCn5NRe\ntvEs\r\n=xkzs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCefSNM9IoaA7qmdABHuMym4Zz93haQq1nuu66iA+GrIwIhAPdeMPPQzlEgVngksxy4OaJTDCggplY5BZxNWcK+ua9N"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.8_1573800929872_0.6085348749508197"},"_hasShrinkwrap":false},"0.11.11-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.9+2372999"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"23729991547dd53d290b45a21042a4076325d759","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.9","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Ed3bayLsFkw93UYXNTh6CjY6kxiJ0WJ9+Rbkkb6YyDSkt9YojtYwxIGtsHVu/WjOlL69nlGnWXCN2wyKN2lyxg==","shasum":"94b86d46abec1b44c4410aca0682663f5f1e242c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.9.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzkw2CRA9TVsSAnZWagAAuVcP/RSlspcZOB8NU8D1Gvzf\nliqD6evZ/CKb+6eeI7NjNsdKFa2upfi+iU4f8vCuRbvtUpiRPYCr1YONDd/m\n52IRSdjOYFOeJo/lC7CYySD9M5C5x1CE38W9zL70ctGlE11tCwHAPceh18kk\n9z4lJasotqfdweYE7lOfKKMxA1bmZ5ohQOsZbbvbiUTWfHxk3/M0P8keY6xi\ne1qNdskdEpJlKBjSpr4nI82o3MKoaLcWsPFidbR0aDf8Rz82r8284jB7d4qI\nmBuKt55d/I8PskFE+tNaS8K0UoJNTZM4xK0ox6OCDJepIfPkyruajyOAaEtE\nl/fCuydQcHA9d4cveeS5s++x+glpejUcnxMukHOffGwDI8yXE9snXojgs5ML\nnlICksWmbqPURXIAn7aR3EoqY4zeQg0hVXZJOVX8gmdMrVG7Tyo5ZYYsGikg\n2LwT/dRSkyQG2TAY0rd/xRLji/lsX6+afzdlYG33dpe4O65cf4jmoi88Ur8q\nWAeDWnhuzWI3Wvdy22k3vA23A2CbD7J2Jfrt989liCg+38Pwe4x7VAj06mEI\nEK3uyd4cfgA8lfReDSXpyj91w4E42vfqnRrU+u4jOc4DvdOQVCt1UQco04VT\n1UWPQxLhyPtanFfCczLlKKaZZ0T/bkndQWpzFBvg0YybzHWNyHC8p6+UmkmX\n4UC4\r\n=iyVd\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGvyGD5iRNDyoRLJC1OZkHK9jsbtImAW4HarjLEp7uPvAiEAkQFSKMWbzLxnLTUJrHfGEZnw/mgz6I6Q1ElOMcyJ8Qc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.9_1573801013873_0.7907672799083034"},"_hasShrinkwrap":false},"0.11.11-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.10+7e1fe19"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7e1fe19e0f8d64b52ddcfd33c8dc87d54d7dde0c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.10","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-jOQ2w9lRFhg8+tEg00wJDndtgAI+rBOsYI5x5WIcnCfEZm4vIEfgoLMARx4+pRsMhuXXvvBewikOLmTCtP3HcA==","shasum":"c606216885f6cf3b121423d02788845aa11c6c72","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.10.tgz","fileCount":8,"unpackedSize":14076,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzk1pCRA9TVsSAnZWagAAVdAP/07nOirYDYuVNiaiFfFz\n0fEpZfC7jJMmGsv0a2tjSiBLThzFkSW2fzuOFhxOGS23CDWLG+F0OP77hw68\naAJPpmv9BV8ZmsInHFvSoz/seIOpNP2id5Apc2LGqDBUJKl3aw51GNJVLhzA\n9g7Ixfl1IUlRusBahxqIGJKfuFkwIkHM8nI9xqc/M10kHjsD8yifU1oTEC0V\ni+09KsS73eXDTd/7STiDSdI+FO+DFUuFboJmm8hnXzrTHNoy/FTj4Yujt4RG\nbfHZYvBX5+/YdN0XhLWeWsQ0iwAQfSIDFAwk88sqEORc/EdjSDHiSJy1qgXk\nOZgb6JvEGT3YnMFrtDKIZjYaYJBbb5Q7TPD/N7bNh1En20tGQrElQ/pqhVms\njCT2GXNK/tqyjACxoic9Bwi8XI/Zu1r+m2pjaQDy0lzTvxcPY3VrbMTs0YIM\nwvgzywudhbnJKgGPOyp7yPq0dSdww4/sFnteWo9ueai79G9m3cDIZIYmmqT9\nTQeyAEK/l56K1Q3dWgyZYnArTGeZzvAm7TMws/yMR0+mpXXLdNNsKJFSd3B7\nSmCiOi4Sd0uKG3cSQWMcLrQ87IIq0XMjtJ359Cw94O8qTFzgD7hyud8Kqd9q\nl67WqF9/MbniHozGsYWNGIY0APMOuZCFBXiuQ1aTUZMBSoNFNI8bv42yCqsA\nA85P\r\n=9uZV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDVuK/Days9vjVz6RJtTzjbHvFHnbvWzxhFHYppW4LB+AIhAOdjIJHIkiSUVMo5++Gs+iCYrUrxfKNx0HD3oTtvM1yI"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.10_1573801321163_0.5900767946688521"},"_hasShrinkwrap":false},"0.11.11-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.11+2b12305"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2b12305441975e24ff767519d7fd0c9cfccccf6e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-rOn7Cx+nqMzv4X4NxDYso/Dix24RAnPVw1tDk+R+uZWWGcjaGZhH9QCY58EJKkQiijQPuDtK6+tMub5TOX3BMQ==","shasum":"02f1b4b251911218ec72a924fde02178b30c26d8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.11.tgz","fileCount":8,"unpackedSize":14076,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzk4xCRA9TVsSAnZWagAADn0P/AjEXab5AyvgWyL74nHV\nKEpp/TMD5Bo68Mi9fa2KpmL3sqvj5rX0d6wugnej4kc9litASvzwPz+Srm9h\nN/c4nJhl+S1msD23AieYhmLgSi4D1nOLZCCG+X0BqTItd/XQex882FvTq4UL\n9HmPIUD9bGWrujBe0kqEaumIOanrIwXURQgGIh32A8nzT814Qf77Dx8+Jq1Y\nryulrFlWQi4oYE/9I0tx6AqCOha1agioLyvTqxvG6l4+nFI0erk03B9AvsqZ\nozs5u9PhVQxN/B2AICWH+RwFmTMPVbREe/jnB3g/2hrRF5oF1WjwEFepH2sc\nWqKJbhOICWIN3tDMgeh3FPOPuefSjjPu6YZ0KPhKHXI5+XmjnYVkMOlSVKbz\nzbM2UjjmstdqBc+9k2LFaGuCGkZ+X9DwVhfVPHvT7tk4139veJ+W9EiYlZYz\nTJbXO2qUm8LNcKV3XeBguaY5+aqQGssc1CNlMfP+ajEAQzo+ZAXa1H8nAaZn\n1Otazg4igHqmQn5OzjZM+VfnHlEs0ET21HPvLeTnxWGtVSsY1kQ7zpkB7NE0\nRBCDJNZHbkrAGV+oA9zwZZG9AoYuZaJz1RcgqzZgMkkU4HP/KSEGZLHdV64G\nQx/h7YJgxq5oIbA426CU+6WEsxwujfarj4kJ/kL5yZ2Bx/7VQ2Z96f8XTD0p\nEawU\r\n=cKJ+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDIwhOFOTytA81TnqLBZvL2gagYy801Oa4hKgKaxaX4fQIhAPd59x0Tk7PFhalmL6Rk2OLID+oezzgTzyNwEu8y5d+4"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.11_1573801520786_0.3914764629603398"},"_hasShrinkwrap":false},"0.11.11-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.12+f6f9d73"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f6f9d73ef1fa8dcad32106690bfb91856fbc2084","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.12","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Ydevn4sB936qYJGYNfICuk/h1bdm8N2LIAMIsPNzSu6bwp9CHAiwyKn0h085SCTo+PNtwWc3N70/cBkVkeu1ZQ==","shasum":"9297ad76156f806d279e1f91eb3519dc64de535d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.12.tgz","fileCount":8,"unpackedSize":14076,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzk6SCRA9TVsSAnZWagAATiMP/1bnVJIgjCwLFeEte0Bn\nPQpKA4PX4PZDUklKaWgXGHEnOOgtVW0g9rqv4EEiJynOhjr2+EJ/aKqQ8oOU\nszo8n5QmTaaiFZbwYy3anFXTi8bLbIP/8H4vnEoNtYPhVvqzQPOy2tpE1vwJ\nVDRWRIN8AGpQrcFOIfjafV96ouQucJiaLuQawynGyXxXIRj2Ul9Pw9D78tV0\nEsmxAhn0nVYQlNOIzK+mVeNOv9i13mwjKlqA2EjFAC11lQ4FQOGfuKg5+RS5\n6vnZUxRTgbVWcCbJS8khEp9KCUQEudYNWh7333ZDbadqclSvkdJiQ7lJNLs7\nP+810acpmXMwbQYlpkJu+A6yysMUhv1KWjk6xTdB4ApA9UtUOupI5P2oFZbL\nflIWwkGa2hpjThMak4X6MSwbk/upV92fPrfS+K5zBChOj/Wt2WzQ9iPFPqnP\n1UjtHxM0I3/IWYqZF/xK0KL0lycrG0iYEeb/b1YqEgrgQcsaxzZPGnOuI0GP\nYCOQ016fO7X2hDL+EWRCY/YFQRyi5CfW4hGqJhNvgpBdijRAex3HXBdIRXm/\nfYzLHXm0jAXsyR2fBDa3Min/U/bVbScbOUSxidJHgszxZa4DKKFsAv6kWv6W\nC6+2A5WG53oyx3jmlqZsgqiwSi1u4SmCYlWWTWaZ/GHB2coFk47qTYJUy703\nrf23\r\n=fIN5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDX/n5RCyjg5x90PacO/aeFMfzkc4yxT9zeIkIa1txSeQIgD+bdaNj+6jyEcauZV8g9b5BX0vHBEb5xQxzZlGcTcVs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.12_1573801618110_0.3715026635599772"},"_hasShrinkwrap":false},"0.11.11-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.11.11-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11-alpha.13+f0c3e70"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f0c3e709ec447bc63ca213047a4b23e2fb188af2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.11-alpha.13","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-PpEVoYhaZ2JtdDu7c3eB9l08+QI4dwGbDEz5OL53H2oXt4r8qkJsV7Sc7NxEdK7Sgf4rzC0knhZghi58ZXMShQ==","shasum":"c2dfcee1deb00fa656d60405ee5f33a733d3b354","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11-alpha.13.tgz","fileCount":8,"unpackedSize":14076,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzlBBCRA9TVsSAnZWagAA4J0QAJrbpjWycDvjTGWE1AV+\nXrjVR29bRbwKxbC77R7mqq7/PXDhH1fONXGyeJ7LDpE7Jl7gMGLdzcceOxVu\n6zpM0Ca65C47oXYm6HfPbNf9MKzQvTjUg6V6vlDCDkuLH9bQ6G/fAbnMUuTn\nE8JU3COe0qVkcKfhbQxr5nc+4j7dBBG77fQWaHtGSilv9wGCZDFwW6ijExaB\nPISjnPnyo7uBnu3dVZuVd4/HjgpIvQ33H6CEvk+CZxNW5PGOHzTnSNtDdFUH\nh2yTCC9uA8HM1ze0vXAQgPpUbw7u7UU7EZZuGlgPNL8mB6HlCWquqAK0q/bq\nMCcvnWlngYgdjXOlERSKqMIoSnUa6m+NUmpBjpQ+rOJBgdHOkUpfaz9E/zC3\nueTKO+YUg0Mgkw8m/WiBUsi+J53dOYRs6zLZ0821BBIchlvcd3FiqpHWCpnA\nqy6Q/tLAkzLjOOyCSTAA4CkoJuJx10JQTMoymfkFyfSicGpbtOBkYuATtucF\ni4ZqLUyJDHXPW6ISyreN4qZzoIjEp2UvDGxwOQpYtA2UQTsUFzBR6B7MlNi2\nbLv10BYxYsI17i4xSaagCb2Ru/H7zmmALn+Vt8IO3XibZuG1T7Ek2wJPeU7G\nTVvBjd13Ho8cGX+wlk5x8L5I/FE1Su2qU6cIfLMUwhwfGJgezo2+1RXqJOLc\nxlIN\r\n=CeuY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCIdtDoPe9yQAvQoWe1EVezFrpJbGKOdgvpKzhjcAdeTAIhAI1LRYhPnKJ6IE8N57y0oALF/El6MUtu68v0iGtOrjdj"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11-alpha.13_1573802049407_0.6529979840223836"},"_hasShrinkwrap":false},"0.11.11":{"name":"@react-ssr/nestjs-express","version":"0.11.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.11"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"80cff19ca378fc92140846ca75b0cd32a041d12b","_id":"@react-ssr/nestjs-express@0.11.11","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-Ic7JrSx7WJ9lwj0bfsrNUuztWdS+asi5ow9e46rDz18QYs6EntkM8HC7C3eswrlosauOlELudC/oUHDwdJUAxA==","shasum":"55650b60534dffe3162eb004895aa8587c61fbe3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.11.tgz","fileCount":8,"unpackedSize":14042,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzlEMCRA9TVsSAnZWagAAuuwP/2t/HSHnHxUW7SPp7mUn\nU9AszLtvEcQ8Wp1aqvRg4sJMos7jWGEMsl6gWDsXH4m2E8UCXwZG/1r6Fsj/\n3GYJzPA10zheUig/iWWoUtvrQYXpmqvHnR+VLowVQcujDM5FkufmOn2i60UQ\nH/X5zDotZzRP5S15JY0oXJAvUWA1xcIXt6u5PZIEN+3XkpXFFgLmtA10X9xz\ne4IrQVltHjFrfIVLR4t/CH1wBE8YrxZsmhDru0ppP7Oeflg1fcQ4qlCiK9nU\nXyFAzv1+vErjzdENjB1qsqcsiHESVN5dM3FkiVDM1d9FD6rFENUIr/2j+f54\n/uEwk+tsfBGWaKlPKBc0P2m7QWbOvTMS21ZQwQ+QECMYf3N6LWMJdndp3YLo\n09syAPmnf5t0Uu5oN5lKLZsKUdzUivZMdQWPv8L1o7ALrmQVI2EA2fMVYKIM\n5HlAJE8o11wzCoPYK+LJOWY2A84++1051a+dqu+/V6QwJiOMHmtJ2D4Fe+8d\nUNWunwBXlGZJbO7tGWRCzuqvx7hxmldE4ZfW3q0x6rvcb6gPnN9UuY2srEVN\nhO1WNODjvyE9KBC7xGBrmvk6MAbPL4HHG+uJZ3cXE2uJptEcm3FffEYmrJhQ\nrOfDRw/akCAbJlfkNWGFntcu9sZfcG1R1dwCKhwGuyI1adssLIjO0/k1N2Ou\nI/ds\r\n=Vkp1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCV9TsSI5hVGbgoQh8ljCCs8vbOCK3StzdZxNAallqNQAIhAINUY7B0gc1srIQFG+KdL66JItjnp/xiCvtUfduRn0kj"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.11_1573802251675_0.6205194293921819"},"_hasShrinkwrap":false},"0.11.12-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.11.12-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.12-alpha.0+edc7f4c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"edc7f4caa4a2affa9c2415882f37129179322a8f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.12-alpha.0","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-4OC/Xi4/qletErIf0C4sOpe210D5U2t9fotWdyLEwNhIsyaup2EheMploHGoXF4Vuiqko1qFKQgbqHm93nOGcA==","shasum":"221d8df7a98bb7423f7192511663e1e40d921d6d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.12-alpha.0.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzlJaCRA9TVsSAnZWagAAYfsP/AxhQbHsp56UhcjeAD6B\nSatlN7PdAprqjS2WkhL02jb/qKkQnwi6WA0FEjL1H7VDNLwCU4Aq7/3Am5/m\noeR4qnZ1I30GHoM7JKjsgAX+Aw5NVjAXK0pe5jwV5ObLWmGGX1vUMmbi0Oy7\nKXNeuuKOHhjqccQmQP8tR6/lFEjAxtvu6NqplWCDto2LZxXSlV3Jpir6oG3C\n+S+xmpPh36XNWvxTrC6d6E8JfIssVdBELBurOcz+XAaIYaPD59XA2dld5KqV\nTrI199dFf0MKmERpuxzgaTvVCzfVG6iAG9rj0wR1scGpWEffrSp2dyf65U7r\nx+txRDl6b6K6fs2FtlyEhDo9D10Ffv7oRvX9UBFNCRGFsrWgVoqkdMDFGGsK\nWdGl/Sgv7n4fKJp6Ho4jPxYYCouWpeHaaCh5K7vtEhW1uQWLb6LsGgTCjqyw\nZ06RXS00vqIAdChSO0pi3IiSQ6hfCPj6wjPIcdAks1uD41tcUjcsgjlRkcSG\nJmhDrjaxWBGKKT2hu2kqT+PyBoiP0YT5JsaCheNEk0C33wd/X+g6O6E0uNk2\nUbjoR87X2bvDibNAgSdmBCx7kdqkXSJo3eWttDKuu6g1T3KQuYhmK/Na5FBb\nVNrpk5pOwDX8LBkuNrjLTQDaLl5/vxWeHeSu1YiPJxuoklaDz8G0EI5fCy9E\nzo1t\r\n=CFSc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDOcZdsK20k0orehqnIEf7XUjaHU6JWD0FqHiwDHVpyUAIhANOTwmCl8isBO3ossCKZtp09AZdg1XoTbxUKlp+98QEV"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.12-alpha.0_1573802585536_0.3928176819742626"},"_hasShrinkwrap":false},"0.11.12-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.12-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.12-alpha.1+44901e9"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"44901e9c26a0f7c0b94cb5b6abc8d11373d1ed67","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.12-alpha.1","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-kPfZcQbnX03Yf2Sjv/aTE7mhmv8TjAju/XasbXUtX7ptb2anV5+M2q322vjZHNrrpKJciLdzJ++DasH6ANBGqw==","shasum":"baccce4b2b8cb2cd4db6e1fa9c7529bab8ff5e0c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.12-alpha.1.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzlN4CRA9TVsSAnZWagAALzcP+gKJeRy8gcja7mqOQLrD\nzDhinFa4Z5d7PwHFHAD3pjxtzXBInDhh4nYcgJ1DfObrnhvLnCaaO10A3Ige\nZAucmA0B3sXOjGf+oLFkQ8084AK+4xM6A6P9YEAeJa9RJ3tkE7IMaAN/u8m4\njAVTtq3XvLGWJr/S5Gx9pgPJMQLKTr8yYUD/Yf4Weda3FKIVBpiWqiQE1BDs\n0xRMCBgE5XZ0TRM+veLZEFlZ/XId8mb2ADcsCf3LzClS9RBC7tSZP4wC8AmH\nHSIvc04fzyY4qZPREeOFpFZSdI1axc4rz3qZNQiqSRHJ3xYXGnwGonDgJFGO\nFaReBWeZA4W1Nd2ChLpUYJjRj+q5sJHM1BzQ0yvhn9j0rQxYRQ+mcLlNfC5r\ndIC6PBFyLUeP6ywfgceBF5csBI0pgKf5ubw+VSS14czC8pfnra3jXapfmDY3\nj42baaJiMC1LOqGeVK0n/VxRU92yeZbzYW51deariM4RgtB7wKZQJROJpHYh\nyx9THENLp+Yaa8TMWIwmnFZI7TL25fE2L0Jw6GXLO00SpQYLPWw93JNCjxJA\nPmSAV6T3RJ5qCsSdK09JSbUaRFp1ZPCfvrW+yMGZ+pNAgYDkDl+eGlfwA4AQ\nzUfQSZqP6oRKIjWl2wcC86LT2K9P6ktKB2pbLD9HS6tjPZgOF1Lub9pmWinC\nqGAz\r\n=KPaU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDAJm11RcVJ4H3O0CAQK93NlhaYN4552hMztP2m8KWVGAIhAL2FuKYt28f/lW8S4d5IlCFng74L7heVEDRum30nhHU1"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.12-alpha.1_1573802871960_0.786943319707337"},"_hasShrinkwrap":false},"0.11.12-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.12-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.12-alpha.2+cae58b0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cae58b0196fb8ea9c5b62e70c00b6e19696f38c1","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.12-alpha.2","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-bw3b6DNZaELzTOrFGEepgksgMwsAkLAKJykJEaN5IQJ8Y6uHoKkQwMpfg/K6rANmnc71le4QzrEv+gKf9Zolcw==","shasum":"f95f1a400d255380de1cca51da4319adeac7331b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.12-alpha.2.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzlb4CRA9TVsSAnZWagAAnssP/3kGQHPTVhxdYjL3n16A\nDSwNXJhwPajIFqmnN19Qdg6fPz3q80SEW6O26IH2d2UwkvPJDbfSonaFIA5z\njTrErvunAIO6+odjOVZOgr8jGezFg5ZT7f0J+bjGfdmbtjwFL6jDiQPKtSvF\nxDvP8rYtgU3/1WVQcT5XsTtLv8VsG0oGC5mN8rG6rm8OJZo8Yi8BuulkYM0U\n1Jc4NW/q2h0hwzUkUIMqNRxMaUsL67Q+5BPRNis8sC2jxy6a5zDy76IvfsAz\nwqciZMemTgbCe6VHeIsDNm6b7YogWLdyW+BJL/qNnW2oqHnFAC+ny/1GtoVG\nLRE+i5EKs+VNEqiPSGQ9ofrKp1ZYON0KdeqQJib9t91leGI4zrXkwTya03La\nwKf7b8j6Cqj9suhVzRQoG8XKiz1TEHOygjCPcERGYUm9mLvvoGIfMNSomblT\nOPPrkEmgXpqx3GPhMFTNgFGpoqbzTZxJClZDJqnty2MF8EJVcN6/MDmS71p4\ng7G5tKkf7UscAbPtA8qp98gvRi1QMAxM2IjuW1rS7QmrmHkpnvHcbXXsjEPY\nqcO2A+nYsY++8EN0znMDpgwsSJ5XoUYKvyIe2yJCHaPAnA8NUBJ07Q6QpFnt\nb4hIBB1t2ntbJT8s+vLHP6SuY+0afzQbzi5TOp/SvLZJmNYxdW2sbjRvVHLT\nyXo8\r\n=4TRV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCWo+rfxnGXzhi75Sh+ckc/J5k3P4v1FcMq1AQuc7ZioAIgGBk5uBJNvgyFddRvcNpGvxbynzcF3N8mAfuPWfQsgMs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.12-alpha.2_1573803767926_0.20481157847419196"},"_hasShrinkwrap":false},"0.11.12-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.11.12-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.12-alpha.3+af41594"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"af41594bef09963c8b9b73c2828fe64d5d180a93","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.12-alpha.3","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-NnAmuT2621zicujp1i93r/2d58PdgABXR1rCF2WfN929gkk2t2F/l5lve/4BnZJMvPBHH65cfewV9bxVQFH45g==","shasum":"46c626e0be9f6a357a5a0dc74c6985d0f4a43dd1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.12-alpha.3.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzljYCRA9TVsSAnZWagAAVPAP/3e+EN9f3eJtA/Pljou9\nkCfIRBUpI4rKXSAMnY2bENNKeMNQXWA/IlJt+lT/UQOiwZRRxDlUVlDgRG+K\nyJPWANYixYNce4YA0ZCqK/8W4Jkwi1YuE5aQyDNq4kr2VdDYu0ROrbd2GWlb\nbtFARkPkriZsvmB1esdspmBOgQCKoFSjxoVYVUA5S7OTo7HxzmFQ5or+l3Zi\negEpduy8ltiXltUnxA6Lxm10pSfKN2Rd6SNyr3FAx3W+h2MHizhP89qFjKJG\n2aRq1E6zZ/XkHFJ5EqOgwOEeFiGbI6BkOtkKdXHcm/39NcT/zxvTthLR5YzI\nLOPUiMbHf76JqCH/SBcyzqR1j6OiILsPoJUtKwjsv3DnPQZ4MhxQy+2su2d+\nWSxwjoaxr+nYkyfchwQ8j4ydQSNYS8LDijZrzm165Yuzihm6aIxvaU6Qx4z3\nPlROFnjIbBX3uXAMompwjrsxotwaoRTKUksZTnP7aebYFSADqz91CsgRGgfP\nmHE1snaLwlOor3ueTP9ewje712RetwFnNkl9M5YIWXcBgi+xlKkrJ/7J+Xd4\nCvl/l9mibwCaWZVr66wceTV/Ta4zNPU/YjkCNxUuzmxjbYa0HKeBk0pfef12\n9Nwhy+F4QMdpyiCUiTxtI3z/ta/wFqk017tqFjcaNRfGNo5VeT0hc0EwGvtA\n/mYA\r\n=MOf+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID4/InxT27aU4iROXalvY7m5/BJm88Ibg/pc1pGMal1eAiEA/1aHtf+YvstWsEaF8Fb9G4Qi2vM2XC2Tbeh61ZCBbvE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.12-alpha.3_1573804248418_0.7632972304824404"},"_hasShrinkwrap":false},"0.11.12-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.11.12-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.12-alpha.4+15a268b"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"15a268b1ad6dee9ad8b62207946b75b975306ddb","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.12-alpha.4","_nodeVersion":"12.12.0","_npmVersion":"lerna/3.18.4/node@v12.12.0+x64 (darwin)","dist":{"integrity":"sha512-IQzHWRB+4ACJ6lTQNQlj3lf+sbv1H4AL0tEW8AbWj6EJwUaiXJxdR7Rj3QBN9iId8e2hi2voVgUbHKl5DgqtJw==","shasum":"91eed24caefb74f4ca97e13e428b683a72dd3843","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.12-alpha.4.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzlvACRA9TVsSAnZWagAAmZEP/2HwhiY/Z4qHzycV0NOP\nBp8vVdISvRiUXbvrBLbWSJ9bo3Wm+oSHdOeCdE7z+3CZI5ojfocls1QSuk3w\nY9MCIHTZbiLaUGtr9gk/IP6QaCpevkHaiEISjPSf63PNrFpmhtbbHGtSrJOy\nClUuuHmAjPC5M6n2yQExFrru8GWvzgEmrI6isCXS+M+Y+Y5wBf1G647FFT9L\ndjCIZYTKjMsyHr311zV7ct146ut0po9nu0ShpC9mgYpo/mGGNsZ3gO+tNYUd\nssgqczwj3p3zTDrSgT2+NLdRRq/yLCUMfjHra+hPsCynNmAZ2TQ8pvgHZlDs\nImy/AAQI/2TY/TASJs2w2AiCItR3q9Wu44pJ5ZMVEBfG3aeG0P2sqavvdngM\nv07maPHJ6QshWRuGt65cwzxUaU27g6/jV6xFsPcq8zAcDMEhrTsbRx973STt\nvasMkaoItL8kjFu0Cw1gdhDyo4QQ2h9fqstS0qFjbRfsIWI1ThXzTdId1ub8\no3HZg95S0qLEPDlLYgqj0MDma7JrNsp+tqsoTNc69lHlFOryVAfiok9AhpKR\ndlhSoCLb4saE3BapPGAPvzjbhnAoDJYicfErAZylUi3Oac2Dub2EfNeOuZ8S\nBB8UXsMh0FKAa5/XVJEBR7hDI2H7g7jtJ6MaxXb12hnEIecD3uX+O11QzqbK\npKm3\r\n=VwuG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGIq7AuloCQ2ZRhm5c9ORrOQ4fzhgWg4weXOuQC4hfXJAiBnLz1/tiDliYbv763Ag8+OTgLyHkIQ1nkC/zFhY+5/XA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.12-alpha.4_1573804991772_0.9763962251986411"},"_hasShrinkwrap":false},"0.11.12":{"name":"@react-ssr/nestjs-express","version":"0.11.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.12"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9b844e88aa59cffd8267c9469bd74bda6275e816","_id":"@react-ssr/nestjs-express@0.11.12","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-UXnMtVz9kh5Ze3PuHOFWGQ9Bzws3VQetI/SH8d+lbAk22e/pexxcMaVoYGHvCWn5N0Zw7PGeqzUINNSKSvoUBA==","shasum":"372c6f35bea3a3f525c5211b2a0f761e282520d4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.12.tgz","fileCount":8,"unpackedSize":14042,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0v4aCRA9TVsSAnZWagAAchgP/Any2/c4lSpbCIup7ZRL\n1c0UXThzgiJ/vyRiRu4GwUn4l0yQauRCUuc3oadVIXhpz6YpNc80VFdP6dAF\nPsIaP96uCc8ThFuCyz3h/WI+3Dp04LQOlZ1GjDrP9P2IDdX4fmkwJqv1keEx\ntSOUWaWjnb0VuMtmEBsD8PjkJvOnJ6wSDRm/y4Nvz5OSs8WZDHGcxWnkch3i\nMR3kSmHWThGrmKeWGPIhwP7/+BUy/hgaSUzANOPDO26ynyWADARw3ExQxWlr\nH2B31kW9GFejgt+93ueVob0e1TJ4oUDMzjIU5zBpDte/kZp9baUGpWRvm/jj\n7BD9rJVe7wnJedMl+rJs2944/hJloW1Y5LEB30Ht0YRdMqhWqNs80uz2ZOI6\nknYlz+e6YCCg/F5G4catqVqd0ouhaZ6DlA6i0YjZRqpabX1Vn6uj1boxV9XG\nBxXWGbYci+1gopzC+MJGq4gL737W9BHGQJ8bNBdMQgotn20ONP+XxCF3AIo5\n7A8OElzGMJ5V1cFiYGP9VB0srjV94NIaBFZVnjabZWt8DTIE6xsIButqPSwl\nMMRVe/t09i27UxS/cx9uaNUQ6GZOvBGQRp7IhkZzxT80634eeGxhNF8b2BA1\nQwKYEZoLC2gPeICDs7iL/5AttyLGF1y0/UyClgrAD0sa15sMfVRgkRAnMZih\nPP1Y\r\n=3c7k\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAjGX5VvTkYBeUsRxltqzhlSZXVG2QQYy9RzdOMag9XXAiEA2URjslZN8zAFNHOG1hItxdmoAiJbqQLUZl1MCjCRPI8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.12_1574108698343_0.5778211657782046"},"_hasShrinkwrap":false},"0.11.13":{"name":"@react-ssr/nestjs-express","version":"0.11.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.13"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d90f24207da1f118953aeb3062bd8529b745a1f6","_id":"@react-ssr/nestjs-express@0.11.13","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-7pIus/XDv9CEcayQMomb7ehl9rqVcMU0U0Ojevx3EH+FC2Mt52dzd5MVteiE7Zp9cMI/qDca+y8r2MeYFjzvaA==","shasum":"3a64b013ebbc8e01af79a1448b66970c565a81e2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.13.tgz","fileCount":8,"unpackedSize":14042,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0v7fCRA9TVsSAnZWagAAGesP/jSLhGzJ1/5UMA8Aqse5\n2EdnUzIs055Y3718m/UahAmQdatZCTE7V420la01+eyYd8sN4eIb3PUtFvsk\ndB/knZpGHWM2NbrKfSB9mVRDGwbkqMO2Ylq8RZ8SK+p56u5NyyzysewyHy42\nFiTyNrl4gN6ckuFDyK+ztM3NDliMHcJ/g4Rrn/YqfFRhvtnh9ruX15VG1Q2k\neVfRRYSctgM9au0/MtaD4IlJv+yuEajCpVqLwhqIIY6NM28EsA/Xickxpo/s\nNre6wPBO4fIlAYfmrmvcypApDrNwwg3Lst1Eqx3DzRrgvBEjeWDBh+nUXO92\nj39a9iqy1jtSiZ0ph+xCNK9EWoNKZjfHynDccABsrwWadfJVleoKnjECV77u\njyWDxQRGUbVDrNulYbhXhmG7nucc2ymwpWMyd3yn21nRlF5BoKkwa0Rm+06y\nDjybsNaZ876jXjVYcXDjbwU/ZknZG2ZYiNRcM9SAxQ4g9wOsGzhTPWdIC0pZ\nEtRNJmmIx++aOKWu/U0G8ruubjuZbQWC6aqlQrumI/IDEWFztL1wAUWZTzE+\nCTSqYzZ1Mf17mzvx+XdIHnM6uDGGvbVzPyxABGbpe8RpOIfPcZMtv0uQnx73\nyAGxPtkkTFSNi/wd2sb2aEMY1FpE9iyauNzTllNPywrjo9PcodyQSGiPODLW\nsT/a\r\n=ZiTa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDsst9TB3r3pRv06BzGNKR7GDZ72YCXJPQdaXf+/G+kwAIhAMf7GebTe67LVAvR1KQHXL7e0WiEvLYGN3TuFwDOslim"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.13_1574108894899_0.3286433763852503"},"_hasShrinkwrap":false},"0.11.14":{"name":"@react-ssr/nestjs-express","version":"0.11.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.14"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f560e44070b99c0ec8ce828d3979c034d389c1e3","_id":"@react-ssr/nestjs-express@0.11.14","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-R/PdW1hG7hD8d4CQkFQRwnKM4RVJbT4jRFgnau2AnWoYptS13PFjzAKEkTb0PcbOv7s9ANcfGA76Ml0m00AvDg==","shasum":"66033a78d34c5b21842ed220e35fb24b069aeeea","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.14.tgz","fileCount":8,"unpackedSize":14042,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0wDwCRA9TVsSAnZWagAAVYUP/1RFUgJn24QytaQAscbH\nUxZWMNffCH70x7qSA1pRB2pZrgzsn9CWbm26TShvuGNtlhQvC2HdBjRpeYjC\nCLl+XV0+IcHGUZQFct2aTsIveoBg42Q0OTFbqgCCxb+fHte6tOf3vWicBrzU\nnrRgKJruH3sMXV1p4MFpHmzk+RYmpLEzDW0+8/oM4HJaoi0vOVgX9p0/0L2p\nr6C6AQA6TBaTMEKfGl8XNiyRl+6B2klG9Jg8WIDHh3ctBQKAzCJNAL4kLQAg\nGPxFkZrWUez0+UNY4Ckf8Zq+JQFVMQLUrQHJKxTkGo3IX7vQduyvFN61If10\nv/o0dht3k1HMROhjxuV8hmOmyu231pmxd4FVrJ7j8zktxZejHaDmpzMsm4o4\nUelFv29fwtJdBho8relaLMO1D4lK+kZYZf+0V4ldo/YfvMU7gMWbAD6/GYbF\n7mP13alZkq7NJJ84dwiVPGYyh5GKF0wIkL/A1fFq1JqulM1FeezqwTabKj0A\nes1Zr1tjWPq3IqcIuBYrwFPNmqvpHqunAyWmSsC+v5Fz/LQnRaIEWbpcKRsW\nJZiZSS+g4yRAK2A49oVBJnYWZQKl1OA4yRGlATKoHYgY+iQ1LcZanIX7xkPb\nH8xlKcpQxrnJspCoT8cODWX2KR/iZEsRRpGARoomYNCQC3+fgfBAJgj0is1C\nT5Zp\r\n=w41o\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGpsrW55OmawMb/0vHntNiV9IgsxRRX851xfp2pLKIfNAiAjhjjMyl5nA5XNCSh1tiAWy9oWYY0DCw13S98IaGIFfQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.14_1574109424464_0.8556093971438277"},"_hasShrinkwrap":false},"0.11.15-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.11.15-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.15-alpha.0+9ea0440"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9ea0440c9c7505c8e2db63652a1959e96e0aa0b8","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.15-alpha.0","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-/rmQqhF/ytWh9IzaPbrfDSw9LHdoVyXUtwJyrC2FRLh826DnMwFRKOZ5UEjaG9yZE2xQIrAVPcijsvsVvbzaVg==","shasum":"c49d75619bab2b6f9ce0a1bff3a2af2e9141c538","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.15-alpha.0.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0wMECRA9TVsSAnZWagAAy5oP/36iQCmFdp8+KwpIsef0\nxbZ3k2/CWB/zckELVh4qsCeGiLc97O1EEcYR8V7Rh0M73jUthyFz83dbYEfd\nVvJGRqEWrQfT+QHA6R+dyLIoeBM27AA3Gc2VjWvffeo5mXtdE/1n2QEyM62w\ne26ajx7ddbMZxvB6fdBtPwXwxDtP8nRgruT9Ijz1e+IiDJZy1x0R2cSXgn7e\n4/snSeMb/4uVR7/i5xivjG58u8Pm0u/LwgS+iELZ5hilOF6qauX/FiuBFzvi\nI0w+C5nOawH2oeDb8w9y7ibJSTnUlJcMQvEJDVjZLFVuXvvjv6DEJdc9lGtd\n3W7opECgcpeZrDq1RgawICFSbVYz2C9xfE8qSI3KTeQQ/SP2pTKYwISThMHu\n9ayLw70cXGdUYozyO874L7kPtRUtE19sTWt7wyQSuUbXyEl0ats7XCHBJo3Z\nSRbH4CdTg398J+692BJvvRQdkMZHU0T8pn9YwNMVUvgol4667BAKPeGDx0Kz\nDrhryRiRD3aniPEVdHzmEQKI2q8PMi7l2AffIE6uAqCTIfKgGz2S2ps/41+g\nYYsWX7l2n8xrSE4zARwsyeOuIU/wIWZtIxPuIiDsYa276EWShN0egeWpGE++\nU+97WIAHTlI5Buqa7wehq+KUl+iR4S8q0fIJM+vk56D5lsaoxw+46PxXguzI\nhn3U\r\n=YHnQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDgj4gkSQ13XEJOLTnyygzIc7/HLaGJTCK5FGleaNwptAiAj2f06hS9kyKM8yF4FG+X3Pe1gBVaT9UWW1Y8IHzL8pA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.15-alpha.0_1574109956532_0.22791572366044943"},"_hasShrinkwrap":false},"0.11.15-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.15-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.15-alpha.1+cf836e3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cf836e395fa93ec149dd8397c180f80888ddf0de","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.15-alpha.1","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-/UU9T2HYu8v9klqaECPyuF5SnwVOpT4mufWcwITA5fQ1JQFvpiNOnpGJNF797eIzqL6EAJydXoiKCE9k3SmVnQ==","shasum":"95cba52ac5a25b50b0424f593694debfba2acb5d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.15-alpha.1.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0wRlCRA9TVsSAnZWagAA5t0QAJjeClEMbES9mhKVYf2y\nMnCQS3WHo03Qn9Db1k/STRUudaYD6T+hmjMGr0h/EuRVB0mMGTL569c18AdQ\nveqUcCpou8SOjyzA3xiWw/DlUZ4MjIFKzW2WWNKnhiRcj8NGJNa/rBn42bv8\nPUNNFR68a5EQPq3DXaIWA7QyTE4xbusgIxeBwc4UM0Lx7knOn2xNXnxp1x8x\ngjeoSigA9zEueLY9AWaAWJmwf4zWvVBEaodBSoCrc+qnvNgmM3Fl6YIS+7oD\nqiOiDYAfp8QYJUVacMFGNhsIKlKTKzx3u7OiPGq4hW698ukglF4jPKWfVdLY\nIzGjaQuhveDCYWh/P2dxC2k+WHo6VPimPfoKUqUjCLmEriBRrjxFZ7XU2375\nzdl2e85GPdV9LCCtxEXQ0bTUihNBnzx/tRhdUcUZiHrJ2Iiv998JBDaUUQO+\nvXnLeOc6/iyeYPodNXNEWo+KuFR6h6l+LKiNDllhGNXOWW5sDOeSyz8Bxxnv\nXMQBvpZtACIohg+zrm/LWTzqCNxtHCCXY8HQIzoeNv8N2iFIGOh+BkEzXsM5\nF3y73SGNRMJ01GXO+alfjkf39InwX+/ZyDzVMoZTCi2hmCtpfhwvcmRbp1oF\n3oHjlhJlFw/d+6mmgl5sZaqCgh3H7GzlBNdC4qYr39GMJL2A9sUEjbxjtr98\nthG9\r\n=NIsY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDXauX26TDCazkikW6vdN89220/0sOa3OgcgnXA2/NftAiEAj9Xiy5J+Vk6lLm9f10Hydqs7bBYeP2VAt3nFBsYyzRw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.15-alpha.1_1574110309152_0.7809982026180968"},"_hasShrinkwrap":false},"0.11.15-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.15-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.15-alpha.2+b44fba7"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b44fba70e5ae98d1b7dad11164c3458e8bc9d202","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.15-alpha.2","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-Q8DaAz1x+8NBlLSiszN8gd2ecqR8lShaiYdmO5j/yS8xVlGvm5dhD0fI4//9IKAWHdHVJt/+MCtelJe/TprkJA==","shasum":"b627926f6a39816a306c2cab19874827a034856d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.15-alpha.2.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0wUjCRA9TVsSAnZWagAAhgkP/3T7FO4m/Ir+htaEAIsg\nY4w5Bu9Aqsv4nQTs7YMxW+I4HbAxGuuixUH9iignfavG+8OA8JwtPXYcVJCu\nmjhulgQKSCrkigDCTqtAtcL9ODdfniiHWGSmk2Kg6gMLM3um2mrZAbGGuOhT\nlzm8V5OUWKEJfzfjYUqPclq07EMHbZcxqpfY+MGPDtHJGYtBhy1zIDsf3e4g\nU89OYSECXUNXItJBWajDlhqMU7zu3zkGaP6tOD8XzqIeMELYthm3QBka01/P\n8DBZEEtHHjbMdwWQKGtYBH2jeIR/xl5XhMmawiczqaLHnkcb8iBTYDJ4ACJH\n93FQXCqX8Xx1pZIXZqdNgNYm98fYG3/5ABo9cenW5QMCg8AV0VETl64G+Gew\nk4ROKkNV/FzIyJS/934BneaK8v/iiVveYtEJLB74vOtAeHB+XuKhbuGq5H/m\n8wC8vWoWa692dp2uGivqgzjCOKhMxFQdhAsbnpbanuU/KO6SCWn4Viwok0eR\nCqpD7f5pPbq4tHRHWGgzrTwLD1kNkmWj2TqR0EMkoH5KShKqi+IwOnC2C5h9\n2XnRVjkV7dQTdGblnWhVP1W+6JmfxQqa9HlAStBL92q6UrkPfi8S5BXjwS5r\n8z9GtQeglYGkH9VUMRd97jh/KlEryd6S5zoi143gnfus9/GnsmBZWXORRBxN\nv4OQ\r\n=HFkr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCRO8dGAeSf1L6r3J4kNe/rd8N4/+7lw/tMZTrJtrAbrQIhAP0UFpbkfcYaXJoJSwYLk3mCucnTPilQPzfO9AbvRoGe"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.15-alpha.2_1574110499379_0.6055031956157864"},"_hasShrinkwrap":false},"0.11.15-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.11.15-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.15-alpha.3+f0c1fc6"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f0c1fc665ed7cf01eb94e3192093e1d1ed98ed80","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.15-alpha.3","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-WYWMLY3ng1XykLQ1ye20xA0OInOX/ffZ4oHXlAoz0+KWS2rmeWp8YBLfJMKay4oHfI/c6bv9+T+rI2wEGXufXg==","shasum":"25cd3047b7298211d27d7b78be9cbfdb41d51509","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.15-alpha.3.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0wYKCRA9TVsSAnZWagAApUIP/jLUIOV6a4jb/eQ2S9To\n8260tsYGsFesSdW9R4yWNjakE6dT691jzNNtlt98Z+mF/CIxWQWVMjlaSW5T\nS2AFadetNWpoATfqovmMgtazEckXltAYcai5JLh8TOeegsW2nxB1LPKcV5c+\nNUnGLGsdSJxSmOxvG5AApwPwdFN2kPWxjAkxZwcxznMq2r5L9J0hwEE1H+x0\nlvW3iocAeIrDwjaUhN1it4hW5RjJD5FEc/6E1UYozyiGUizwTvVcumhkv5Y9\nMy9lC7/SB1RQ8Yyjl1PT44KSypHGC4T8SUa4L/JQzVBRs+fabqbxNPM//svx\nv4JX1VvaSG4V+n+u9aMjbklSVRHCOVsv8nMp0ihvu0vQNyz/hZ/lFyuK0zfG\nrmKMnZnVgh3DVlzUXKzNUnoaYBjzfidA8DlOLMqMZE6yMRGTLux1mmfv8ImM\ncj6f8N+jgpQ0thtNoXoDxeMt/8x/wa+sVyZK/wR1c1PReIvpsJHaw/ppH/AU\n182o8ZHHDhphwMvG4vG/BjV1l+TWCQc+1K7h1m5CZs2B1gXMVM4DNzzCf9ds\nZ4k5clEpRhw5TaVsA1TXO1RjvY0kBfhmJhgK+8Pgu5m5IXSUA5S6rV58n/UK\niYjFVjNiyn5tA/6Sl9sH9dScIr4MnGhcoH/scrHhvfQFBG+cbKqjxiq7gtRQ\n5Ubt\r\n=uhcO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDlW7YCEP1PEhaIjmQRrDkUlWdCeaWTYCw5+Yw8c1qKhgIgYMh/7O7v29oNGoCj/sVknlIO9tWMybOT/gTd1kDtzjs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.15-alpha.3_1574110729563_0.047647564651428054"},"_hasShrinkwrap":false},"0.11.15-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.11.15-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.15-alpha.4+1184d43"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1184d436793332a35b2a53d9c707fc6760acab34","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.15-alpha.4","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-0bZlt6EQwCq5smyeQe/ih0yEm4pt/9TzNTOrpw42R/3u1CrVA2yrgfiU6k+8GMkL2+Ex3SaxhWyuQvl5uDew4Q==","shasum":"88e5c0a35851fb5b6621001e259e72a7a295a298","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.15-alpha.4.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0wbmCRA9TVsSAnZWagAAZQoP/3mPf2byVSX9gtD2H+/X\nKcMCD8tXFX27aFR5nws1eRZZXpcikFMoFzfz4vTFksuixf1DjsOQJDi8SrM9\nPeUgJtp+DSHSdTwy32FR4VnJsp7rjsPhojCSAOT3DJ4b84zBffLXvOhMUSGz\nDbJF14p8nr6aR3Q3awe+0Uhl8csPwkgD1OjsBhLdA1tOS4JZ2qJ2F5iU8WuO\nq6DB0z84czWuOSI+lM/kLtZAJQHJEVNesIwGz24KFg8YGFiILzvaGS31Pm3Q\n7Pv6SuEgLxVQKvoj4cO/p3xy+18gA2E1uSQLtaXm7HnXRaXjEBmC/2WS7yJV\nMmt6VlUSH9WxaC/JSZgyt/v27W5/q5JFfwwnypMCEhxpnJkaxVdqz3KyFgdE\nMsesotqf0mdTjUlFf9G658GYFdOrzruMLdmNZwuJDXZ+yCTwc+YZobty/oWC\nVO81lyIMYPhCZU/9I0UrO6gXgUWzQb1j4VB4v2XSv5QIB7Ex17SWa7819aJX\n1GbVChfzOtfpVQ1FHkZXYjpul7CaO0R/PY2ZHOcBcAwcF7pmk/jC4ueQPhS6\niwo2Symkd2FMKcUQQOa/Qg0hReQfdo+GvJ0T0r57YSpulrxG6MV8igScWAIO\n7KBshoDIQjF/4v/ih1PYI9R27ecHrbORshYjwTehsfVQdmMwP6x1KBTwniAF\nzZdr\r\n=hwsn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFDEjtpRUh5pIJ+kS0nBbFvPVBhEl1RS9eU7Kynsd25QAiBpKKz51zqGro4UQu7zLDA8g0jU7jamSlUMB6cTzAEPJw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.15-alpha.4_1574110950307_0.14038825280564127"},"_hasShrinkwrap":false},"0.11.15-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.11.15-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.15-alpha.5+796c371"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"796c371e9207a00e96c15b41ac8ded2d414f8763","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\nFor example, let's consider we want to import css files directly:\n\n**views/index.tsx**\n\n```tsx\nimport '../styles/index.css';\n```\n\n**styles/index.css**\n\n```css\nbody {\n  background-color: burlywood;\n}\n```\n\nThen, we must override the default webpack config like this:\n\n**ssr.config.js**\n\n```js\nmodule.exports = {\n  webpack: (config, env) => {\n    config.module.rules = [\n      ...(config.module.rules),\n      {\n        test: /\\.css$/i,\n        use: [\n          'style-loader',\n          'css-loader',\n        ],\n      },\n    ];\n    return config;\n  },\n};\n```\n\nA working example is here: [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [ ] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nWIP\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.15-alpha.5","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-5Y/5V512LH3nqq4TTAmYU9xcg2Pw16TEw8/PRwu1nlFilnHGxYlGJFHDehenUjokJUddfIPF3dk1JjVpCe2lPQ==","shasum":"bd021dc3f00444291233c52dcfe727e6c05108f0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.15-alpha.5.tgz","fileCount":8,"unpackedSize":14074,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0we6CRA9TVsSAnZWagAAH2YP/jt62bHoGp/4MBWZGN+Z\n5Ulxsnp5yDYYg+2vAer0REgHIASc8NxYCe99gEXUoxHSgjCr5JzwoV65k4ES\nSJsyeYcYNvqDCQBEDV1wekELgQPcS80G1dl+Gl+FLwaRFu9A1CiogVnk7eQQ\n64l9DMh/P9+04M2diAiWX7E/dy//w4hXh1iIn52CVIpdXoUI9muVAIScOr/X\n1o5honBTkCDAh9cz9+9lnkZ8RAGqTgSJL3VBPBAe4Sv41TRCCnIWmGClZasj\nR1X6nV0/krkj4LDKw/RffJe/c9r5iqpGE1I8LH0lgoxNRJqNDNxL1CwoB7n8\nC8PRIHxsmggpQbmMdk207WMXZRx79s1Oao9Z/+Xp5ziNLBahk/8nXXGAoh8u\nkGr4ytkQbbN63mn4PZqPjSpXw/JmCX5YoyJGP5oS/28F+yCy6Cz7sM6a/qyq\nlAVMXkgOGxANxhXBOuMVL0nVZ6cKbn3DbpnXLSGJM6zvA1b/78M82xKbM7l5\n+Kt2P8v/b1wt/rgNIt1Fk5N+f/4mn0SDo8E3kzvupvqFEu7/oNsGTXAa31hH\n3ilNfODkpbI5uwKtKcpHlJbs3T/+f5H0oPl/ILpzUoWyU7UXMXkfuAefamtm\nRRiYd4f1N/UtrymZ362rvMJXw+TjMmEtOUfk7j198eLteysV4SZhaLOJM+Te\ntBDK\r\n=ao4X\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICLkMkoV6Kf+B86ucY+qeH0xHDcP6vqgRjJyTgC6j/y6AiEAy48cXE1UOeH1/xvEaH6gG6jgiZg0L/Hw5iYcI/RZ9fA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.15-alpha.5_1574111161779_0.33371397522022717"},"_hasShrinkwrap":false},"0.11.15":{"name":"@react-ssr/nestjs-express","version":"0.11.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.15"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0b3782e57c1a3554628f7d25b98794ab321d56af","_id":"@react-ssr/nestjs-express@0.11.15","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-wkPMvGEcmMySUXvdBx3lVew3uN38j2OmvttYY6fps3KGori5m/yfY995lkmq78Od18NoGov9ursZhSGZ7XhOXw==","shasum":"bd7d073341bcafdf0958639198508264bc45e3d7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.15.tgz","fileCount":8,"unpackedSize":14042,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0wgdCRA9TVsSAnZWagAAHZMQAJZucE3xg78OcyUddvz8\ne/DIL0ZAbzRTtNsGLlJsnD+niG4doZS2A5axmal9B65Kg+wgR0EabezDfu0n\n4ubLiiJyUsivEFlBwk8lxAQfc25xR50hhsDVhJiNcvJxiyDykhytrTwIdrbV\nPUgqgS0uqWSpMFSf/rBxihWmWZptt6KDiEyNvXeyVw94ObI+aQHbvEtRORSF\nwaXcUeHIIjUgBXha4yLHx1qW1PBrNDUq9ydbr1wE0LdtCl6HhzQ1zbQSrevB\nDIk3Od5tRyEVgWNbLpaBACGAPKZJfSAdyLJ6VcA30t4sninY6PTislqMgHZ+\nK30AzwkKmpRbOPMmTK1lQdtxYQRBqQO7vtGu8rQHb/6pRZyJTDphJSNXcvwg\n2j2/l1pIQNfqUL0e9kyWvnpSaKa4kAj+seLbURCUJWbq0uc+wO1Qkml3mczQ\n5avqiTf0LXksGMHXdCNBtNcTYNmgNwo1mGdHE1+s7m53RUV/OFRyTgYUyzF1\nWkrcrNEcGupybOfwY9qjuwLtreMFUdVCR0C+XYO0hzS6RxwJYp43uLxnPXl5\narHTaiilwGwaHoJAl2en/O23wQCkrgD+esiT/uK7Y+YjfLkwoyiwnNjg1BrY\ncO64Th16U2OP8qUYI/xDO8vwA2hR/6RxEnQLtqU1W79lGEiz5+/yXbbDCckh\nNzpZ\r\n=e+7V\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBTc8AvPEzvYwLAG9thzYDfUZmPKeRNBpLQdb8365V2nAiEAqnLIIJPNALkJj/Mqfo2lmN289nBju2vEt9UXM5/xp8E="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.15_1574111261477_0.46222564235766295"},"_hasShrinkwrap":false},"0.11.16":{"name":"@react-ssr/nestjs-express","version":"0.11.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.16"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f1c7c06e5016bae4eaf2f3100f801250dd45c88d","_id":"@react-ssr/nestjs-express@0.11.16","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-C9/y2Rdh6bOQjn+CAFgfugsR2Uor4TXWiaHfEvmDdfLh6Qbya6Euck/TOWmTfxQcMlFTK/tm/pbWWBxltZ0cmA==","shasum":"558f93cf823db1d66a10a169dea23064cbba3774","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.16.tgz","fileCount":8,"unpackedSize":14042,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0woDCRA9TVsSAnZWagAAGJQQAJRsPzWVzm9b4WzwrO73\n76ay/JvxYfKogFKn2Q4KTk4Uy52ToiIPePEsgc8kYZmZmiST2rxoCpN+P1Ad\n0UMO4j0lJJwk2h1bjynIX8a2xTPzfD2T2m+9QxConpgkLDpNJ/WlvjA/7Aw5\ne0/4Y0JhCL5BiRvo7IlQ0wrnBPARIZriwLNql45Ap3Y9WuZCHfPkCXm3Vd7f\nvrM+puNnNMKoOU9p+49BpyLUYK+/217OjX8E3i+MFU6FGQqVMU5roKepCjHj\nDcCDjZ7tE1LwNT9pSl4i6Lr+11deJ5OIX9I65xnelg07KRuae0/YnpTQq6Te\nM5vKp0OndKqihgLeeDgqcYVe72uEMcvk1/BFvptpvfXJKj771uNiEHdtMYVv\nn+pFiRZsrXm/fF5YLU1oH5VzhwtyvtQ5ih0AMLNKVZUx4JF6PDcOF88zYhmj\nXl76DxLwe1FzSxBdus8HdrLHNDFH8hl2aKLyn3DDo6rB3s9Pw2VRh3n862Ze\ngUEkrRYcZ3HfjmoJVwSZdQ+UiTHje48/TOrfn9/Y+0KBKoMiH69tSEynfD2g\nR8yaBA2F7TLJSsVM9lJ4rVvPNNR+uzgSjm15BrFTpcKHUDDuyGuiZBCqNOqP\nIBqhAb+hyAbLdgDVJK/Og6CPYvL5J3iILgV77evJ7S4BvMfzdRxaey2DACJS\nKK5P\r\n=RBNF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCxXphmhJTjaxCdgcDCMx4YCnDkgxL/KQZQoAxEvN9pswIhALg5eaFXLNCkPc9BSopHSNnK+/F5MddXLABQiOW/arat"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.16_1574111746487_0.6756480286791522"},"_hasShrinkwrap":false},"0.11.17":{"name":"@react-ssr/nestjs-express","version":"0.11.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.17"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cbf303d49537fa4e6fdcdbdbfecc828ad1e311e0","_id":"@react-ssr/nestjs-express@0.11.17","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-oolm6WYy2B1ltqclxjPuUaKYs6YS/Urlg53wAG9dpf/MZqW70lQtka9xJztTX/en+WbB/g7ZDz31/9to3HDC5w==","shasum":"289a81791c1c04dc382e14e4201f947605cde7c4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.17.tgz","fileCount":8,"unpackedSize":14042,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd0xAtCRA9TVsSAnZWagAAHfwP/0Fegeffu1pqK1UP6zAb\nYs+zSpNvyQEWIxzkA2RYSVVAUMu5bHGEf0CKWRZ3XCOBwWTaNURYa6eB8pNs\nnP2bscsVe9OSh0AgWpP0nZxtGgd14B/MBXrKDBrf5BmstLQm4kRdCuu4enq6\nlPSxOeXweME1f+EWlm97MfPIVy+P3fWroeA4761/T7wr1wR07j/yWwQvbKLf\n+taEzdlad5P4+LHBoEwhzBOstIUsOYge5EDawdI04QqVIGQT7Ct742G1nR+c\ngVdU11Q120jfH4GVIAHLg9TviMPlIZR/3XnXhRbHLM5o7UMpDCfhRjpp3UhR\nuKVO3DBz+6MJCroxQz7dQflVbIWKvZ7FCBTdbYH2ldLucP8MDT71R5+03eFS\nZl0z7LaFrH7L0sS2s3fIlUgoGAt3Z1JKEn05WJoxsybJK6hl2FHdRwAl1n0w\nyuyaITGqCJd0kEsg47Skt+QqyDTLWG0XXTQGuaNtLkGYrfKayJ43VD8MOY+v\nhfQVKqx9FHclR4k2zXHPUPtkuhVb6BNc2XviTWJozyZOMwEsj7QgsgPjwHpl\nYlOOi2wFyyLRv3XU9F+HaJyxwcoFPgbJZ94tjffusWYow7msjEflspxenQQ0\nuOlVuSuC7pmdNgCXD4OYhM+BDvxHgVHq748bkq53s8r6qKzx+G9l95gj4Se2\nIRh0\r\n=zX+i\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDXCCsxoJ3TSWNVPdxc61qsabGFtUV80M886OX6I1memgIhANNsjeGgL8Po+xsz+LiAytAOcaHAUuSFIaIMw4RD6rhw"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.17_1574113325075_0.7206709796905044"},"_hasShrinkwrap":false},"0.11.18":{"name":"@react-ssr/nestjs-express","version":"0.11.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.18"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2979a44f0558aa4072174b3fdb8aff827f78f74c","_id":"@react-ssr/nestjs-express@0.11.18","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-mt6+Ittge+lqzhVkewsVJr2A2IQ0zGmeI6bMLzaepMAAlrC0PlKiubLr/5n/G9rswqZU/1YGT5U7+i7q4vedvg==","shasum":"7989dc3c51cbf7246646e57883bf15f92474a2eb","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.18.tgz","fileCount":8,"unpackedSize":13907,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd00NhCRA9TVsSAnZWagAAoTQP/2XF9SSlbUjZyaLZJ+XF\nubyhjOy8+pqpl2FFHbLHU3+LgBAseWt3XoZ5B2MJfNc+7DsTNCPpJTQUO9Xa\nTHBazNfmJ4Xmnbcwn87ksVGyRbet2gNVj0P2VzEov9zA7u/uPh4HaScG6To6\n7V8g6CyyMz+IdAPiyOFsrtFoZWDDtY6NcsUoKT5gfc6S5YizRLAl7cSVKYjT\nSpXQAqbKmBq+Tg8dD35yDZkXkSvrfMEp/iXM9uALSxqv/bfDcQyVrP+ZyhLT\n+qG6Kh5k8h4hXATkAJQdeGuEeIms39CTSrgYUjNpN/AWGvQDbPXfJDJ4n8u3\nPL9UpMHlOymIdosB5SwMzOTjm9HxnNM/1IG0Jq3os6DdBrJI2Ehdt30WTK2D\nXu835+79qqlsB/XGHdNFxYqYu5lyuwjwVp6oZ1DbiKYqEl6VHVqCq+BQGOTn\ncBAgCsTXo5KfhppkrG1gskBOklkpb77csuEmYU1h+mwOaWRhTQ4CncEfAH+O\nGuL2Q2egJSfh5ijDAZEPVdBchpcYO6smEpUQXiH5j/BNaC8/rAeiJt5QhGan\ndwCk6+fhbdVo+pfIswoYI6tkkuN2tIrdEr5OQ0E9J0aipesR9rsSxhb/2wM7\nSTOEuTBJCvu1qBmI8SrHWEeMsk6e4ma9as4pBR2j4Suo+rpsSKh35C8qWRPX\ndy9U\r\n=bTwi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIG/fJTuJxY/FpMnOhzAsdRPcZTHRUrPdLZko/7MkQuc6AiEA+n6EhH94XZz3dfoEmWYruJohMAhTGlz3SdX/0w9buAE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.18_1574126433050_0.1662056876105651"},"_hasShrinkwrap":false},"0.11.19-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.0+14f188c"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"14f188c58ca3a8efa0b4e187535e2dc1bd0e9bb1","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.0","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-548oazsbRTnAnU5a6IEdz/VZAAJ4k6jXhda0skWvKqwEG+eaTBURm/DPq+Wd+UpB/I3JJ8v55ZOjmS5q3uMQKQ==","shasum":"b83bf2d986bb72d96a480b0be5750aec131f4d25","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.0.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01LGCRA9TVsSAnZWagAAzfIP/iXjWIHrQoToMIEvG+EP\nVXlqQD1bnEp/xh7vhzEbEVjztmXPdiSl5ldA0a+15B84RTd20zU92liT3QW/\ngXRqdarkevaZsSVzcLPMEOLPS4TJpxWB2mtACSmijenZLHOPtd3MToxnJmJS\nKhmg3q/1iHWJHes8gNMDn0Xn/go+0Mj9DtsNVY/Lo4R77vf+Ia5wl4eNH+ZL\nEIXQ4sM68zJFh4jS6Z+xflLyTjAb9ATWXEXzSlksfes2nHs9sPoMSXQEVrCO\nSUkXyeK8jefc35o4XcV8h0TOiPdgyFxWIgDDpofp9JezFh1HNNPpVYM/WqGm\nKQjqQw5jEY23lyi/mo4mdF7oCb7ONjuWRUglTvPXRZXQcmavlpaAn+F+3pVz\nJE4kabMPe8VzLy9NqSWNktbcgB5+W6g1Lf4ChjzYb8+zmDfmtMvbRPjM2lNZ\nwjkX31psFFBugbQiugG16TnsgzJr7IOhVnSkMq1c1igvF7B5I8iy76nUUxed\nwndiuTrgFK44WoXxVyiM6ufKHA74fEPZrtkzpAXIhjQIb5onLod5IV312rsy\nbtFTalwBB9aSQsy1K5AdUFJnl/9BkkY/iNNS8qCkT0iFQtl/2CtE4YzUP5kI\ng3DCLzMlUvXwefyD3oqssEmDFJlZdejgrENf1vXsYserLvNI3tu8Q1sQSQ0Y\nugSp\r\n=GsCe\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBXRrm0kwvUQrUqu9J8UGOWJzZJG8jj/Trgms0BQ4BsbAiBP1thkrjW0G24y9PePjCqHfduEvI/AKWXvl2TfY9tdxw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.0_1574130373930_0.5161746192899688"},"_hasShrinkwrap":false},"0.11.19-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.1+cbc6007"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"cbc60077921b98c574d6dbdc9f5ffaf6711587e9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.1","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-i4OcA0gR6UJZ+4ujphhoEzot3TKNFFRkwbVPrlB92HDwADAzeJNnSA9EGEOigK8WD1FEI13YC4ufYKYdb2X7JQ==","shasum":"f078e8ee839dfddfc85a50d323ca68fcf1ef194c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.1.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01M6CRA9TVsSAnZWagAAS4UP/R2Pso7/4hCca6nSiXEa\n+GevRpt+5Ktdta8PcWEfM6Ia9JbbOSHekieUw82gteP6fG+Tn4vwipxHwx//\n4BXwDRrw7qfrRqIgJXpX0+ETKc5cN3HCmEYrKlN3zk+DcMOxAAzI44wmwfQ2\ndIbvpwTAMj9I8+8nV/+d594kEveuXaJwCvpCauqHhOcKG331m4AMzZ0Mb/Ft\nNOarHByZ6lEF0RZhBlenDBCbZy/Pxr2169/aKvfSwVnxN7TdF6I3xiG6sEiq\nyaeTplN++nzAH2K0knZljLdWxFFDv4tUx6KHGyFDY08zpGxz0QAy1fraScgG\nyFoV59wwcY0+WMPc6feLv00tvdq899w8i8QcMZvIaHgjp34CaVf56rDKp3RE\nkjgTnGk/AX5WfCYYsf/9GgThlyY2XSjaZUxPovq3diiImU+fBgwI8aONPTSI\noL/ANvUM4KPDW54u/yEWTqc90UntCtsedci41Vpd2Gjhr5gKzPU0akrnUTD8\n17EZIF6jTlELqMxMSJN+Sy4i+mGrUkUg/mjZPgQcHj9gWQ4Jc+45U/GOuHrq\nS0lcoDjbooUyPPgwb4CmMVRwC7+U2y1DggP0aLKJha0aqRK0DikiP0RDGkPd\nGvM5TGv9ryCclzrGEI7myZXeIrF+6vklK/8osxuApJVHGof4NdSOp2nByTWD\nQyBA\r\n=nsjz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDxfHK482lP2CwsXCiBFYw4XuR6E4/gLvCyUwZIq7VXyQIgFpnsgJudxzuSE4hbGbPZRmcdXmgmwu81ZIRbclTdfy0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.1_1574130490113_0.2851643897749918"},"_hasShrinkwrap":false},"0.11.19-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.2+520960d"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"520960d4566129f950dccaef75d70e00039cd38f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.2","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-V7C6lXn4VlFrP0AGsCQSU0F/lhi0+YXI+JX4xQyzWS2rCZ2/x7UjI7Wtemw9uYOoyrbXAGjkl+T6QfsQae0KTw==","shasum":"11801ff627fbac892df7739e951bee7ebd8b2825","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.2.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01PZCRA9TVsSAnZWagAA+MYP/RJMhaWsJsJqAexJqY1t\n3OLThWx2czrIle/8dlktCMCHZDlis2kz1SIn7OjcWZilK7k2J5q9tjXqwYF6\n7UlXh5DWtI33iYZvoh3gGVRRWWhlkWX4LIT1Sg5E6aeCZU/GKSIRnvqzeq4x\nINTffmiAPG6KMsXzWHITZSB7CmHiCjPN1VQ08+fEbrvm8npKzX7EyzMQGY1T\nu/bJmQ3mZdD1lWelnj7Cdv3eOx51iEvlFznkS1I5y9ZqAJAqiJaBnZOXgTnn\n7DpfII6OKvBBXujcGd5O1gDIgP5tOpWdQ8LgWbgWZpNaIHsJ00PbrfSMTNVV\nqzp8chaoxl5Ap5W69w+KMCwtoaBiAwMgaBP20muYSqY8ViHNKut/BrxmDev7\n+4R/0NRKTzLxOOxck6CdJMXXmLSV6JTl9R+r2On2CPZktGdEVfTe7a2jV0Ei\neH6SmdX8OFG9YMIDxFIoD/nBXFB72e01qu/lz599PhUZHmPCuVyJ5GPfl/RH\nqp1XfDkyQ/m71Um92RUhL0Uyiu8so8Ox3GuJyIoAVjYfi7U8Pla/O804cLCO\nZD8XbVDtGTea05fCShnvfgyVsGyig5TxnYF9XU+nsgGScP5ztBWOOHWgfidV\ntAxBr26qVnBMft0sEEyi+WpImIWEr5SI1zfOZoSz2KW9aRblhLKfg8ERxd1s\njZ6Z\r\n=bthd\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFQjXBkXsAPzvHnklNciJ/VPwRCaC6+7lrDpbZ9P2aOlAiEAmi2KVnBqRVwUxrdE9CVE0qK+o2sV8Y0h+BuNEaot2zI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.2_1574130648986_0.6165770755555213"},"_hasShrinkwrap":false},"0.11.19-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.3+7611de5"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7611de5d1b6c326c2e066b391b41dc295d9e9e28","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.3","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-J1oAKcBmgIYdZJGCwIEWXwmp3vmfdLlvo+hBxbqlAOvzQIuM5RjuMORop8KGNgCylgng+aTVOXkt10FQfc/rCg==","shasum":"33489e7e2a1ab5124af17f37047ad504748e93d2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.3.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01RLCRA9TVsSAnZWagAA+NMP/2hg+tOGbmfGovnn8Nw7\nv5yvVsPQZSYQDjLPsJiC1v5Trbpllufw471EENbLo3y1/ROLqufDxzADQimA\nNgUGeORVi9CatzhiG7YBqL6KSJWxScL8KOl77TlDGevaKdJsrYdpnTfjbWOP\neJwnwee3SSbjeDCk8WWMfBElggHJMMYc15Jcv/kk939yysRzxI6vUMItXcFh\nzYwU7uBkWtGFQPblXiXPhgRSeHUIOn6rn2n4Z6GSOAT7gM4daOClr6KbGjZh\naXIXYM46lSS4OFHUhiC7Amx1b/pLz23L1gLfGtO6BESryBvchFL76F9QzX7F\nSAboh49nQbxCq/xQVBDTbWr5FhyPMKt6e/0tUysvsqHX9lRzmeJ/v0y8nFtj\nTSxenzfgJycTrqD3bu9pzjgiWAAW6LSqinwKVJfHxZUcawRJ/326gh2mSqtO\ngt5Z9UkFPoqqlZ0U1ssJB5op2YOzUVQ5m3+kWhr3zhV2QD5BK45Z54hnm/ex\nKCEdpp1a++xpO6M5LGmiHDMNBLhntMQ3rT/cJuf9Sq92UgiBy3SNNmENv1fC\nmcoxj4m2TYG6EoRF7BPEX50hotv+FZI54/k+8J297kKk8jPEZ1vWohY0Qyfj\nb/SBlwzFxRdNoJXK1FYZBkvV3jU10oEd97VKa2HTWhEfLV5fCCx9GaqdQj/6\nMVNG\r\n=JnFI\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEIO+S6Rzte1oWVr6szTC6tBwev9Mkpduj8DGmu+chJ3AiARFTVSN/1gyrZrfkY7Aftf6n+Z3LpgaRULek2shZquyA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.3_1574130762906_0.8645878921731605"},"_hasShrinkwrap":false},"0.11.19-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.4+2cca9dc"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2cca9dc1bd1658036527b85db7900ab153635a85","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.4","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-VOsBLu7Fl71CPTwtbzwpqm3tXhtBlOSK/Tp1Xgy/xHX0nYpJX7IZW0k0/JW9e/29PMV57fEe2t7Mc/6aUPpULw==","shasum":"3d9ad57aa38eca1f92325ffa43ceec2895641ae3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.4.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01S5CRA9TVsSAnZWagAApCoP/2+Sbh6useR7HVBC3AmA\nylGQQIqrQVXIyVOS5PFDy7FPXuYhvMrzYV8RkWvjUjLNKhJeI6UFchTsWAXN\nTgqnbFjOWLJ8z/3iqLId0s7UszDcDckU1v5q/rxSQlZJRtUkBHxJXHfT9wsx\n0vbG7y6vm8/mKrNyDLZFkzCeyN/1FN2gcEueLAOJME/dpiev+jpSfZBm20r8\niN6dHDXUHDnR3B/hwi2Ij9wGv3HA0IZ24feD9uYDqyhLHfkxN7iMJMOu2Zun\nQjq7Ny8EwT9Hc2u97MxJny5xbG4eKvsvUVJ9zGBUbyhETfosWkXHzk08lKjB\nCfF7DqFBXgyIhY3VhdUflhKO5gb6TXhhK3qx7dGEpjb53lAL1Nzy/kDqtdfl\nG11WPSwddDwjwvZaCLSqBjumNhj/myw8Yor3NPz6INhax0qtk6ORO2osmUpo\nu/Hk27eyFyR7iQCtdPIw0DWC0zeTKRy6KM+rk54dYQ8bNw2YfNxqUZEAheOa\n3Td3EDKfxOJxrfvX3qIXvHf0H3EJmES5fr81DeW/xoSdT7gcYndFY6PDqkqp\ntQvQlNchHPaEwj7M3wKWStxoWcTjK5Ky0h59RKrY7wpNWkv9htCE63bZ7joF\nN/LqcmYg+naKD9nRQbzYAzjS7GbSV66FjYg/dGGRVIZZhvH+CZ4FsKTLEGXO\nejoc\r\n=Qxh0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCHLfx1/ZYOoa6NwTW4gav50rZ+gNtUYMgFZjHnBIzg+AIhAPMM4HXkGdtujX0Fr6SZIBGUutqKcNsgP55/3kdYUl5o"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.4_1574130872800_0.4218627853267749"},"_hasShrinkwrap":false},"0.11.19-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.5+163a311"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"163a3118d3d5883ba997c0ef4cddc0e65e3c292e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.5","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-4qHUIf4dO6P5udTC2QPQ5CEKKGP6Mb8t0WIOvu7zHHEnoelH26g1O7K8y1XYR/p2LI0Y4VW2ez3D6zr1tNQ7dA==","shasum":"875ac21f3751cdde1cd1d50ffa1f8998ec48c06e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.5.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01V5CRA9TVsSAnZWagAAxboP/jbwPG8opuVbE5PVwXl2\nIfr3NP7MzGvtdQZfm3JIguRlaSEsdjl349jpdUmtILBJawAezHF8ImT2MvSO\nZw64NLVCH/PPUwUC1A6sJV6BC2PnoC/2qYzc3F79K/3y4O6G6Of7BvH5l5gb\naxjV3T6BhCvxd3hHy8fTN63gfHVYvKSTr+TzVp4fVrPK1b2LqmBKCpvU0sOL\nz1C15jJuh6zzm0LstFiaxMDRMdNYY/q1ZTpS3lLId5cUOJLvyA+L/qfBb/ov\nxuWXogP50yq9zq72izeouF3uVopa9j+LddpXrnnpOqqWLX/HGQxKfLkGqycL\nKgc8HzjqRSdpt10dhrRHuN4Aro0Psb/53FeU+QDNur8L8H6RVZFd/i9eoy3d\nojJXIdIkRgz3HF96LruszkOsBmBCgvQcQKuUc9H5IXO3LXZXE6uiQv0SXEUi\ny9SdCOeNWPZpYVfEFkNFzfdgrMkxMgwTFwiJDTVpbwBQwNdz9PT3VWFbMNf3\nUknzM+8c0mTPGGnmGq+vPoEk3iHDg+WubQ8aIDBBxxitLI8SYCDFZt4UDKTT\njZwa/PHK5lXY1jBRI8UGER6Is0d67MVr555FjtTKk/l5PaXTh0Q3F6Bsdt2p\n6aV0vBMwhrOvC2eOvMxPL9WidaJMjz5fRmlz/3x3Z2woBeUoCS+0EfJJ1RNR\ngG9b\r\n=zsCx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC4LS6UXwR5/Txvbc0jZyNNqS/Nu4ywffz31WKvafZqwAIhAMdkMv2c1YG5niFPNvWRxJlllrQrDUNDrMTwgCALOJqg"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.5_1574131064532_0.14415582606153454"},"_hasShrinkwrap":false},"0.11.19-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.6+ae6e992"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ae6e99284419949cc405d7ff6b1bcd7a63f2d357","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.6","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-ffOy+F2IWK2qkBBxgKVEsKma4WOruUVpt5puqkX9f2kYYEwH8OiViKL6WB6YhAjmpli5AzIGbJAXLEYCARhfUw==","shasum":"f9ec4ff25b50d4373bd299532287d191452b62af","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.6.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01YSCRA9TVsSAnZWagAA8WoP/34KUykcJcEdDyT7yT6y\nmKFqBsecf9McRL3AZjwqaG5HlYoc7bli9fyZAgAwMo8H+1vtA/KXKPinu9dL\na54APcO2dSrFaBOUbHQWLhObu3Z+Si+KDVW5noAPC7j5I6Jkr0l1kVBx6KBH\nI+IQTTFWG7rydMEviM3KoFR2KkrP8ASeJOpuwRDeByFcpUgnJJ4xCXLfo1SB\nwjrVQXwKa+zC0R5E/u02AasOh23PQz6p5F3iOI+KQ+Ym7wGoAlAI2KcBnlOT\nlKYFy2GRBLSiFKEetfl4k5JBFq3mJGZeiA8uaFB0w4jHOyABxUZ7BrszYVMJ\nH/WGonamaia0RhMdsi6fMIqKV1xnC7uUbYpqjBcqLCvZHpA6KyRPc6aDlem9\n/sg7DTWf3jHPV/oApq7fODVQwCPTkWaEQQO0AIK+CcUdXgYiVsBxOmwL2HSQ\n7tfX5/CCFWbjtrZuwejy9S61BwQuO8lOgnKTjCXSDTQ8LJRuVsat3FXgtEW2\nRklbnpc51tSU97XOnL8kBun5t81E2IIAgNjBzhQfl7AOYvrtUpHOHbZ883ab\ndlouxXYEyNEy0duUDkRx+AYlKypZdGk+4tDCdAzSX6y0j0ThF0oVB0m0TxZw\neCnEVg6Cf2iyahv6a/1cvSmS4Exr5+oQwKm1F4eqjfaXTHVapxRN2xVTTkEu\nFubu\r\n=lCj+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHEAagGqEEXggojKqxJQeSTfGakuXylbiWTFPBMCR/DyAiEAhlRoF3E+WPwyP0ND+CaquVP4rFW/5qJ+yrgclTzWbCk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.6_1574131217824_0.3882949990566056"},"_hasShrinkwrap":false},"0.11.19-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.7+b692114"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b6921142015c6a9cc1d86a11c8dc95ff880eebd0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.7","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-11ze8pXTgOIpTL5TV7UU7OJJjVfRrb/MrLtRfUqW1Nld1Y2aovrBVANLg2QKO6RQ3Jmp89zKj8A6WvH9KL8WxA==","shasum":"8aae6b6f992a05a50371811da983640a6499cbee","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.7.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01bzCRA9TVsSAnZWagAAlQQP/2sBGkHrEu2M2E3/QWme\n+agFq5LlIKrgHtRYiqMrBdPsBUUudKeL35pMTI2oBGZl6p3UDRFTRQP3KSQP\nud7f60oamfI17y5J1m92OxJ0youLVLC1BCFct80Ne3tT4tkFi8PXV00gPq9q\nBWnPejFooOXfv4Gxd9xdNEDbLhv8tt74NYK23FaSI3R9fBqgf9qmg0lzSDbC\ncL1Ht8Kd/lkg9PolwIVXdPl5zkhfa5QkOVHwHzSjsAOTt4ZMi92B8uESB/1F\nt+vs4pHMFLLXQO/mAsN3BFNo1n2YmuGAxIpuLiQUwuQ7PrN1Aj+IBrhH0n+/\nCwcf3yw1QUBrS51sTOG8rw/91ZqNOBbZ2/Q8nP0YrGrtDJW+vclyZdAQ5Qmn\naXyODiCm9zQYIqyHilqPgBBW9KtY0GVfIIbyzrlF2pglf1vBlCrXIei28VCJ\nHjgVIEp3PXWHoiqbfukd0xjbuMjppWbFio7cJiCj23+eC4MxPD5EuFL/Y4b+\nWtLlHupfhtKb3Fxc1CXDgabk72scxVEVArGgyc+IZY+c0p6vjQzWOcJdAieo\nTpUbkKTm5wLL9hLRbSquoZS5AQ76IjY3Nw7TAR5bjHWpgIKzYZV2lErsBeg6\n3Q6zMPxn+Ghf/aNZUDkP9nYr8N/iI4jQRuEb/ZLMWnjH6+EmZB1kG9QDELUX\nNP3K\r\n=rjLL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCDxwNlUmGFVz0Nxceuuhs9wJfgmO6Hng4U9c3Vgc0vZQIgOyeB22tu6dXQh2rvdD2rqnbZx0V6LngbzfQvNIo/uHU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.7_1574131442970_0.4711913232737519"},"_hasShrinkwrap":false},"0.11.19-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.8+aca07ff"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"aca07ff76c6840aeffc7c4dbabcbe822270b0525","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.8","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-RvezMIAvQxT+RZXYuaogk1vZnJvkXa8HPm9CK+kOP3xTYCDX2BATBnIh6x2S67uwnT5eiA0kg0SPutAJ/ReHJg==","shasum":"b6118d94c1830a8a9f374fd410540ab49f03c3cf","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.8.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01dOCRA9TVsSAnZWagAAHBcP/2cIwIRKW4JGJVSjlCBp\n7gsf6US4onyfcB3WP+/K/Lcjwkidf3ywi9ouw5uehTk8kZOVE/wRz6fMYSO5\ngJKfd6YRWWOhbsS181/D7+4ZP5oMvXs/HStHDWl+LOWq0NhPQzgN4mU+3gtX\nx+Km3K0XTXCTwXRFRij52Y4f7tbZJdmvmYkBOVELhxWDKhJyhBDzCB4uz8DP\nptacdzBNGKAvpG5XTi54zjydLASe5JZXKraRQuHe1GvjIPzTzBsEXj60C014\n55rpP14OoDmh4sdRGZKsqKcR/U0r6jDzaz4W8YQKoQbDdNgySgAii9bzAugl\nxA8XRb/XsZVq2esUbR6AZ6UGlncpaUixkc0i+ZUvkKYTgmrSG0C0f8oVetCG\nCepXd8Pyf5xD+oBZpjOVqBjHYaC0LNcQ6jFT/cWUWhi+cXY0yLmLmfglYkWH\nIQyIppr8Qw0jL4tIieO3K5DflNHhirYcI/38py/nuz2UBvdU+Vx0GwVgJK98\ndroawnAuqpgJnGzGZoEtz3MYolTt6vebb+jbj9ZAanUODZSJOmaZ9eXQi+c0\nlAfKKMvlxsfXqHqqVpg6Jae6oggZp/tQ7C01mtmAHYnyiYrMH40rvzxAq0du\n68cyQvBzHIWUd7nbJ2Ihj6sagl73yvZ1fuAWzQ5mU0XLHzBAlN9IWea76eIn\nMfpf\r\n=dRxL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGVbvkchQ+vF3vgwPTE3+MlfH7gYqcxIO9fVWp35pCTrAiBfcsSoiaWgWEvlDqSawmcAhMKa4LEOc3x7TPBHnkQYLg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.8_1574131534008_0.014900339422029951"},"_hasShrinkwrap":false},"0.11.19-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.9+f608f1e"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f608f1e61d4cba46b5e7550084979fcf6670d10c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.9","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-2mU/drq23061Laoqj5SY7A7QQm1DQ9PiH6kkXtxxhoSZXpewX2me/cRDByz7bODNrHg684ODA5/HFnkfJKDUgw==","shasum":"d0483eec2c6f66e5d882104636f4c2598d06a97f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.9.tgz","fileCount":8,"unpackedSize":13939,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01fFCRA9TVsSAnZWagAAVa0P/j7odvPiRSqzzsB1FnRi\nfBoAdKqrta82HRbtdEQmm3j/1U4lvwilAraDHO7j9pTYDKz6i1sI+PxSr/cg\nHfGGBfQuxCqivRpwZ1lYUmhtdhhAMH3q1pRNVFA/j3E+LNatm5ExQ/a3w347\n9bybpSWlglUJ20UAocd5wy7Hgf5KG4pOgJI+BKIWWxEZS02TQ9gbUyy/hEc2\nZMM+kqqqbaph4tbcWQHs8W/w+Pc6vxCIAeM2S8gqJudSwiEt8wknZu8V/+4X\n6pPF5SaPm0red7uJfDvrIguSZdE++Q5yfHrwseS9BU7NikBNwJJHatoNEUCT\nj8YYywa59z2h7iN3WbTk37D2Onhk/DKnFvlLnXXsMLmpOPF+PZYNfuBWncTQ\n4UrzPjRjo2tfgC8CSR4FH9JZwRU6d7NZyQbWntl9kyhq1eiVCqhqmFLVmgUt\nNkcnwAscJOwhbbqNE1NZGpx2gr9osKfJk3U8vdi1B013jREzPU3/aopRBQmx\nBPchxgcVEXfiogelT1dkFRE57XAldW8mRyvjnItf8eMlPLCvZK6fs774T4Fa\nkQONnVF5tKxGAIhHc4nyOK4Xc5z/xXdQvva3QuWLl5g37+MqyhijcHxH/wYK\nQTeTdd5PpeSH8mD9gl2aVYvZUKoFjj4NagI06kVHLGEvh7dpnNuxJwxtBBwr\no+e0\r\n=Irc/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDlvC0FVaTkqVgeYBRN7aen32tJI6tIGxxYT+DTFk9PMwIhAMLbIzFKO/Z53LSwZPweCNdvLxaSOF4eVXtgC7PxjhEM"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.9_1574131652994_0.8997854935699512"},"_hasShrinkwrap":false},"0.11.19-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.10+8680958"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8680958215d44337f31ad2c8041394c35f4b5559","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.10","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-Bh3SedG01QzS1TaLFyGJs5zJ9hRSV7YaHbV6DM9FgKQex85j093K7bC6mjZ+7rq5rAwll2U2NzX32wSUOSSAqA==","shasum":"c9c9b9bc90891ca1f6c860374253ad97b6e48219","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.10.tgz","fileCount":8,"unpackedSize":13941,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01g0CRA9TVsSAnZWagAAdVwP/0tkc4jbG9nwZ+oddlDL\n7LTNolUItaTfHTvYPNp7sszi/oIYKo07NXU9x8ubxAmOM46S5D8Xxiy4AZMn\nXPH4/XCULvrwuvIdnEVvcRNLEbRPA7dRuqbavoZ3SLhYukAUsdLEjEDqOH9v\nWrz5rp0lsJPStMArAuc15n5e9hf3EGpvaW6ZACSdtXSAYovIo6tjq22M061r\ntihURpFw48Ut1eGulpzCfZY/m4zwJ1CM4+wa54XbKSczp+Vs5mAPyM7NxHXE\nhkL3vRPTvdQI4DGLyg+Aeh9Wj1i1kZL4BGQ/RCtmcbam1VhNRnXrIb66zOcs\nLUsuDh3WwjhXh2gMzzAWGNlf275yF8VZpSwhzSeTv7KXn2/XB1vqNSc3/tVL\nYkFd1qpzDLh824DYPlEiW4jrbR3ztSefdlnY12IuGz1Wj3AOHiVurUr+1YjL\nw8nXrAYR0lSkpqYHkLBQBRAytVN5OJWV0dPMKP2tMrIUPAv4u41Rj4XHbOcY\nEaMOS5/9BWF8cV6WGVLsMxdnSgiIAQ7G0DDPQvMdVuddD0BlbOd20E/xdu1H\nKlrmrsHNjG6TZmrzNqE4WBOQn0+oG1XMYj7f3Dh3xQUFhc0pFkUHDicp7wMZ\n1puUJpVhVHA+GpkBYAn9mfwyWCyArpKP/ctPF2fWS8dbAQ6zaXxrxCfE0oMZ\nz5BU\r\n=Qagc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD/8+BS525h95U30WXqhcMd8xMVD229DMPrlM6AFSQEKwIgBDneJuN5Sjn2nv50mw9goW0gAHbF+XlqN/jkJBF+m88="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.10_1574131763666_0.6854943927377266"},"_hasShrinkwrap":false},"0.11.19-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.11+20bc0b4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"20bc0b48b97e8357ed5dae4dadee2c5c70910084","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.11","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-KkOVOeF+TqPd7AhGYdVFo1VcVLsEAWQDgOObKqeIfvm4kdpJmMT3oAbdFdfsqjWMceTZFDRbjknrPOyvNH/HEA==","shasum":"778327b2b6869d498836284d56dd7f4c857c2c44","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.11.tgz","fileCount":8,"unpackedSize":13941,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01knCRA9TVsSAnZWagAAH4AP/iizub67rnd1pMKXHQaO\nA2vamwlsM5gNi9Fs/CPIpwXO9X1bnNyZ3rhicPQmJF9Q4x5vcZiMiPmjiXVb\n9F3MZCZA6JVN40bNBfn3vFTM29fb/AOAQky4ReRxERfjFabEib/VBvn47ba7\n9ZXCAgqP19kzAzSy+VnG7ZKs0UuM+w3KSuglhNmA+JnIrfxLkx2dLPi1x/Jw\naXSfKGSclN9YPZp7P0mefowmxD9I+CXOmhGIyy755gdtrNxbC90pfgfyze8S\n75RO5ITulbi9nlEW19r/uuoVNzqVSu9Vsrt7BeFphR2SGnCGw/sx9eHisEXR\n7qb4ETJho19/7G/Li2cah4BxEtqXHtCZVkgaaus8iQSsJCoeSWjmly1WrHiq\nmfGyK3iWBPbNwYIYCP/rkpwoTNkdv4bmm9HQmrWSA2sGnKyc5M3UcP15WHqq\nZ5OkOSjOztVVibuaW5NbMcO1c0+zFSOY7bh+UgKbc+LK5Zq4FhK+LV/3TPHp\nY/yk7Dobk66DLGV48j14OVIkulQ5VznP08gKLJV6Cv3j5JGERWiChujcqfz6\ntUMn3fZ7fKphQIG2kdaimwd/RMxUdn/s+Sm9Tce2JPJvrTXvrI9tU+LlyeSj\nfcN3l62CCY3YsUZh5SgerR1orbCRVfP2yJQ60t3KBRNRHLSHIXNzOzJR+Ro2\nwENL\r\n=VhDB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICZvWx2FQJhEsWOXIe2YaPDSlLtQRynkA0WA4yfYs/KVAiEAhwvItBldptX2am5fLbNMsTTS0KXPOOTrXpyfCwhpCHk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.11_1574132006706_0.9633206641838783"},"_hasShrinkwrap":false},"0.11.19-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.12+43f3ad4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"43f3ad4afabef580b8cf20905b1881c4e9ce0dce","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.12","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-0MqenRw8d9luxdHq4ohImoy3ImJps8MDSxB14qjIN75QTlHOVDhiG3r/8EuZ7GP0TqIPgQgvxt+J0IuQrxh+wQ==","shasum":"4397e7ae3008d95a18c0364ed91edace82223157","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.12.tgz","fileCount":8,"unpackedSize":13941,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01nnCRA9TVsSAnZWagAAtZMP/0jDvTi2GHKHieNaJI5B\np6xzJ+VHd7Ozol3WvyTUGypmx5rc0Kqlo215Q0I9xVlhvRVuwz3HiBeQlwBM\nvyE/1lbYnFEZKrkahvP4g68ndbm9IrHesV1CfqC5uX+kMrt16eYFSNpnmS7Y\nUOyRzkx6/xZNFBjmtH6G164797iJxM6cSF80uj5Eu/NOPTHPkA+MVDSKdkD2\nBPfT859n/FVvugv5iS0vTtMUH/C920+LLWE9U3hbYQB7JZKbyO6tmlTvTeOU\nFDQ+uj1fACT1Q1kMU4vsccKwVOS9NwsIH3HoWMKbRYe4mOLNAzxWob3yQj3u\nlOk6Kh54khO9fJ4kYMr6v3SsGeHn5FzCkefiHGOP6/YKaN8GZxXQMQfECJnS\ngB2yDpWx4wu/3kCBPIiPOsEeHIXFDGibwkj5fl+mG8PI6oNfHDgUVupfxtxu\nRLnuY9DoMre4XrNsM6iEQmXY5jP2+A0jdp7HTQdQjGLTJz1JaBSJS0nMAOaS\nKlTBaS8bF8UavAH4/voqO2i/bsJZwRCdP3KLUoeohD7WXzDx6k/BrhAxsbWI\n5rKH58U8XfLxQECE5o0bPNB9Bz5eNdIgg5zBAGuZqmKCbbD/MOQRaIhuLY5Z\n7Ltj4/RiHQ1XqynpsVxjE2QBtPlDel0NteXtJuSCOqa2xGDBh2WS1YJj6Ap/\n3sFQ\r\n=IxVG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDXTQh4Ar2xC9u+4VpqIzUfbHntSaQRl4ScYHs7WRBgkAIhAP0u1TR5+EE9e65Z7SSZ/oiieoEl3woFeIzO3FNDD/yd"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.12_1574132198605_0.012130415479605805"},"_hasShrinkwrap":false},"0.11.19-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.13+e115955"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e115955f99561edfe1f52900381a2872ec80095a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.13","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-lQfDlCACKHMfnfyFi/CdDFgU5m6kBNfjIRYVfTGfqjqDJvaO0jAUGkxMASwY32L+kNOhxT7AzbNEydDbH+sWjA==","shasum":"92805ad02bb76835ca08df9ac249bd3bb82c6bf9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.13.tgz","fileCount":8,"unpackedSize":13941,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01q2CRA9TVsSAnZWagAAP4wP/3bEteciPygbqIDy34Ul\n1yh7A8gmAK8FuqBZVFE3H3Ylz2i0eRcbPWJE5fOHpQKJprihkqi9o9n3uLVk\n0psxfn48QBSukAcr9OvXnnNt169x0MpPdNxZAalL68sc+iVWBGX2R/vHIJFp\nu8hkm0FigtOjQbWcZ+aYBpRX4yy/TyNe2CPo5biLqsMHXaoYdUFvxkgBUFCU\nQUEEZLd2wXtUMxzaDP++7sG6vW3gxLsJfsrvJeCT++BMxLRsAyzRJoWLnFSZ\nzTGPs5z8uYb1Jbpbw2iQgtQoYk5nOAg+bQai7GjsNTJ2aKuSjE3Xitw6BWag\n06BXWKAhpv6cUA4P9c/ZXbgVZOHgquQ5a1uDxfcSlPMeWeT+oDuma1PuABZM\ndMbUlSgLzeKODh6+S3tzIQGM+eILoYr1soRQySU2Fa3bB50Wnyf05v2lTjvE\n2LQbja37fwmXW0h7Rchz+VO4lmKdLO9u5eYLh6YVElaO6AS7irVtWTZyQhZT\nIjOorpBX4Qj1UKG1IJXTLoBMkiFeAEbSyKQ71UDkjYRAfNFkaAAKq7T74rD8\n2FD0T3MI8cnVqhojYhQsrFLe3v283x0LdA4uZQdGaPUNHxc2gFRnetpJz9rh\njNrRYIjqHhhYlwZ3rr25TLcoZ9+HxnFrOcMOC5MgNO702m2baGpaJOLxCIcq\nYfyn\r\n=H5/z\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAmfwrZM/kpBeqV1lGvixfWS3VnMc9+6/SIEmdiCpP0bAiEAhtEUjn1EfcfckuaRwgvtwE6F2N52zSdU0PPs8gaRXdY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.13_1574132406065_0.18402354860318226"},"_hasShrinkwrap":false},"0.11.19-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.11.19-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19-alpha.14+9038a07"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9038a0754970bef62e7280d77bf8252c2bf1b19e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.19-alpha.14","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.18.4/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-k/E35goer5ygIKvgBGDhZ+BPXtL+PAWDkkCuRBnmAaq3cb0Cn3Nvtyrdag4KXpA388/PrqsZerX85C5eMFKjtQ==","shasum":"3087d3a083e0d7e3598d865a0efe0df10ddc02cb","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19-alpha.14.tgz","fileCount":8,"unpackedSize":13941,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd01stCRA9TVsSAnZWagAATgYP/04f9MVxT4mpdOIvBSgj\n2RpfG/ZOCD2JytdizpIqrunlbtseiUNUm1wPiVPN6CEwdo/Il6pAMlAPzjfu\nM9dLB6kjoDIWS34VtzkWMmFrLZmOs+54beHaHUIH7YLG/cJGf4x6Vpt0XeDj\n1SjcTk4fbCr78o9xaRKYYERv2qXKXpiZ/bdxG5P9yRPMDm9kooqfU/gDk8mP\n0NpwVRXnBvAhcb+FhVih1jQxVE5/hknW9teBfVuO9vmdadGvrAd2UVy8ODss\ny7d508/mso1jqZgT6NGV7oljPUD9KNOJ8DZpkZb9r4ehIMf1NplCqWz5J9q/\nutTxD+ltFhq3XEJOfalJZ+hs0P8ZvWc7DaWANich9R23AKhFZXEonVD2LJcH\nmdE38DcS3Rpzk2l0vnSnAR44TSLYU3LfiXhdj6Dp2Ok0wp1Cg9VvYiJW4Dll\nGv6CNGWFuJj6HtwChzcbZdZQGOInQtNmQmdIwro98Ep9mwd7fMMH8iEyunEP\nE0kRAyQPJ+AX8y+tDHN7HMImUluc37CcJkIyNez/b5gGSMo3uyl1UzGCHvDn\ns2/WFx9F6jNTUiVSDl3xnwQfrX4e2JAME9vbo3O8xGIuSBacdriUr+/99GDL\nIdB/9Gwg6SlyHrhur1kohzPViKNgCshLv/c7bVaxG7/KrO99p+9G6sffWyh8\nn859\r\n=7DWD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCraqmsLh35Jn4h2xSjSTxTAZqGbjyY2hPZAf6wiUYAhgIhALF/ln3q/e9Udq2XLzpOVMjKBPJvuaFjyM7JxChI79zN"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19-alpha.14_1574132524692_0.7150959641563586"},"_hasShrinkwrap":false},"0.11.19":{"name":"@react-ssr/nestjs-express","version":"0.11.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.19"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"24f56aa3fea5a9ad02a1f7c2a09c221809bac1d2","_id":"@react-ssr/nestjs-express@0.11.19","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.19.0/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-TuksPpAOhtspraDEEkXvHbsJq5ozrkKCgZ1oM3MjXFKgK61v0X91SIe1HVPgtd/AQ8hO4Sl71tJfyo4KINx+QQ==","shasum":"f7d57698a08eeda26df602dd50ee210d4cc5e2cc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.19.tgz","fileCount":8,"unpackedSize":15092,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd1zd6CRA9TVsSAnZWagAAveYP/AzgB32p6l4wrw24Sheq\n8Ci6sPfoKHKHtNNmcWkTbc1anjM8N0GDzYTHomKWdJWRZNZIkNP3EfCp9iTA\nLnVv3y2QvhWTSrMC+XPzGmob5R6ygLz5yfDsNanzIdcPUJuf/eg+fTmRPCc7\nAh6lgHjabH2yFuHjTGEpGs4m6TjsnkAPkL0wAunCKIuKECWMnUpwCOA51q1n\nxvCqOUlmV6o7rJVjtQ6MKUavdlZV75ryo+2P/jdaLne32f+0/H1zhQ7k4Njw\nw/VOBDLokrkruPeb194iqR2wmKL5MyclxMHLi+fzXZRCZcFPkA9gqGf7YGYi\nAVIBSV0iCD0eeSdg4tomHv2nk2HTC5wYhPGkUix9pykoJB3NdqGfzc9FhAlI\nBIqAVRmEW97LBvIQhjASgoDo/gPA7LIHh6nd3FIY8UIyPErWJD5X/ObBGGXE\nx2OGRH2GMFHzWLJeUEBcQbNtoFeViHjbRKjGBHl0U2V00ikapAI0l0znQsgy\n8kL+hOF6QSb8nJ+J5reGZY7o2sE+TzWNk6tMss8ogiKty5pFkon5kvgS5rGF\nlAwnQHOiGx581mYTwYUA0bMCCjt/Pr4hm7yP99u41R/KN4GoL5DodldHuKGB\nndzKYgbJqMZH+t8zB1P3WV+Hu+JRNBDhjQmZ923S8x+QBTjJpBobqGunEt1A\nglWq\r\n=60dP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCSroWKjQpUGqbTy/+x6cJAJIRqda3WNy8tU68SPli8JwIgTWQLxuy+PwX6X4vFjwtJX2/knP+yasdsoKGKZJapl58="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.19_1574385529453_0.9359379271477399"},"_hasShrinkwrap":false},"0.11.20-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.11.20-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.11.20-alpha.2+ce99302"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ce9930210ac88543b4a147ce01858b89d942cf81","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n  <img src=\"https://img.shields.io/npm/l/@react-ssr/nestjs-express.svg\" alt=\"Package License (MIT)\">\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  viewsDir: 'views',\n  distDir: '.ssr',\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` outputs production results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.11.20-alpha.2","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.19.0/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-MxA1Uv+Zuw4z4tZ364KryvLXCDG28vNycNawW7sFkTyUw8OUyKyyhbJ9D22rUM9anrfLyO/BW/dPFCwkfjqdbQ==","shasum":"964f8308cf035fdc71cf78f8b309fafe1b0a5a0e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.11.20-alpha.2.tgz","fileCount":8,"unpackedSize":15124,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd13HPCRA9TVsSAnZWagAAYZ4P/jEeiYv417Gf4/TOcTWR\nqoOSQ1Oz9v4/fu+nxXQB3aWpmLTOv3OXqnstRCGLZHuwo8ARl4fUZ+i5fRGH\nvbc+MRNrfCUM1/QqDBoCcvhKHaMOH/flzG4Y3TxrcQCxVqNRcr+FCG4mP23e\nancSXNQanoQq3QaW5TUTHXizBp0kHnpOW5arqfx05Nq+GUtJqgk4xW9gQ1sg\nYAIkMXkHWSWwIaMCfXtUGFwtKWsGzRCgNt4vtceuDsiE9tnbG7nzOG4xtL2O\nVGPVMLTZWqt3a1aNvVjKvoSIOfb5PGQIVqbe9jbibI1XVc2zMABhb8hll/YS\ntRqk4av87m0xmIOr3vu/29xEYB65AbHnhkcqqsENYIDm+79haSRe3L9wzHbN\n2CT5PCDO2UHITziiZR7oIy3/ok+jJPKAAUuZBlJfMlwgpYIc+E34ZwS9rZ5U\nUT2AnN+pCGj62xYjIFcLDQfs53z9M3jrxEvpwGl4KNHQRmlGcCw+xspTRU6U\noS9Xo5EhMHqaS5scQRDkJhPK3/XVaujdCRwU8e72XFsL8XhFcJ9DqK4Nc5TN\n08s3iraguVJgjnAgp78gdk4IgCJpgRm1VUP+uVjWxctLnQyyGRB19/P+rglm\noWNPjyRrzwmgXk1967lcOHIUNZN6m+aZFcMYoUanm3s89L0PKITt/WgA3Tvm\nswKN\r\n=JUUz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDTQWkNms8UV/qJ+oHU20JR1/Ra91itMQp/os/fSTuxDgIgP4phTbhu+2UaZSglwNnDv3DAKQM35qqiC+vKGcyBYVA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.11.20-alpha.2_1574400462605_0.716762315991905"},"_hasShrinkwrap":false},"0.12.0":{"name":"@react-ssr/nestjs-express","version":"0.12.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.0"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"17d2cb9cf7c496900252700c08b9843b5e728d3d","_id":"@react-ssr/nestjs-express@0.12.0","_nodeVersion":"13.1.0","_npmVersion":"lerna/3.19.0/node@v13.1.0+x64 (darwin)","dist":{"integrity":"sha512-CM5lNlFeBb3QU2N3c94bNVcmHxowhHdrE8LyTyPVmEzHHBkBdizv3jouxyCDtD+1cEDMlyD7KL7EMRu1cT0jfg==","shasum":"fe5bb363df4f4f3198fbd92309349f8f53950c62","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.0.tgz","fileCount":8,"unpackedSize":15552,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd13haCRA9TVsSAnZWagAAsZ4QAIZsFhUntd1FlzTMnFDX\noYdL/vvypPpn+vQwnMJCnE46wjGCleUWOsO4M7ZwJl8v4qPh5tbjoagZc65x\n7NO8y/torRfTFvgKlGhGIdHvnLz38E1j8SisTvhFSa3CFOKB+gvlyST7M8RY\nvtTCCTxUk5+GD0RuuMEnWsJtltcIrqVeuOR1KNudXtqeQ/PnQU3ocy92fTqv\nm4jkfnFFg/QFVH6NzbGrHlYWVJl9CldtfmG1h3lkR8iTsZnNoCjaqKh1ZfwU\nr1iQt9Y19CMIc0tLCOwOgRIJ5SgNodCNX+y2aaiKTuWc0fDtpeMGvitKFrYd\n5QFrIbZMaxPtJ4trz7+U9zdcIA3PPcugM6VWdoPujfg7vllFcdCTdgDnemEu\nkq65lO1h7Uc4TbTr797qGrTx6b1jtRsCv6jgQ5bGL5slkSaPAUEp1q9nalCI\ngkLis+rgPk6srcllvxwXhl8xr7Yev4lBA8CYdZX0McXBVVSFzT/RzIZp2Wzz\nXzI0RSxS9erfHydpXVqb21dPUkds5AnGb44YmeLLDdtFAKeqemufaQym4M8V\n8zJHDpitXwspmiiZ8VIv6ywdX1alsxprZCW5sWYWeW2Nxd6i9epg6FXAsq+X\n3Y6GtetiLWiRsPkBaYrYCm2ePB+qfeEj5C3mXNgJDjmPkiiEJ8uApJMs7hbb\nhNRC\r\n=ebBy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQClFNQiJ0qicluhMgogxTIIumLRz2trUwWa2rQ9359nywIhAJ/N0M6uWCqvY1lc0VxJSCObQUKxW0oEurfGDogIifZm"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.0_1574402138483_0.12138400726473786"},"_hasShrinkwrap":false},"0.12.1":{"name":"@react-ssr/nestjs-express","version":"0.12.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8553f17c2aa5f2a451cd804c247dc41d6143fc0e","_id":"@react-ssr/nestjs-express@0.12.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-nIxi+D+VTEs+B/pgN4p1Cxjyv7e4/aCiNyk4hVQcgtrC0OD+9Uf3cBMwZvMUkx4De1VdfPSECRto2du+qMOH0g==","shasum":"d7bff71e4044eb917c57ee004f6e590f5e6aec6b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.1.tgz","fileCount":8,"unpackedSize":15451,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd2u9NCRA9TVsSAnZWagAAWzEP/iv3Xvu2D/KGUuo08c98\nzXKAVLe/LC1+9+WSqG3L9Ws3DAKT+8kkn2fjqOlj4RPcaphSumWdECT9sR2K\nnLV8Elw9EHdKWN2Cws7DcByzBZlBzld4dUz9wSZQEaMNBqos5VYPcc7jyLme\nF7eTmM1LVFJDUNca8RwaigFXw/2H3ZEWFocuJ3q4Rh4s/vQeAvFas2Y5rj21\n2E8WnSCxQcY1r/vlbndF2bDSXB+wWg6Xv0dKGiMDMX5am9vAW8j2iVIzvD4l\ny4dn1n/uFm8VFMvstInJktU+jhmbpxhRpF6D2Coc9pZTJtBoUJa0yeBmYJdr\nhNN5mBxmWQMSfuuNUZc6Xo4yOhohZV6Z5DakS/0Vkx48d05cqplNKjuWVO38\nwtSBWheT8OXxV0DO7L/d3i0eWOg6XfEmlpO/tL2qYQokfHIiJiI/iVsohNK4\nX6ridJfjqlZS6tg8XGAhjzp7SNorRQNH3osNMfAIom0Qix1re162/wIUvM7K\nS/v2caxU2jTO1OYx4ASUF4ZE8z4r8YPt0w/ich1iRTxXxA9zcyBVwOuIVnvb\nOAstUv/7/PN2123vR+pUGC/csc4aqBuwiPyiOGh3yTpG5Hl2vvCX24SCN1qM\nRrkA0rbJ5YvpTNZ6ZbIvv9k8ugnKBsNK95HMB50iV4u8cS6wLxjUUf96tm+f\nFgyt\r\n=HED6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDx1/p/7vLy5luJ7jYBWSkfKvqnRXAhElyY5BkpbqI0TAiEA7lRRnqz891fxm27t23jCEf8WjuaLcpoRn9vyaV8YfUA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.1_1574629197225_0.38333165378946377"},"_hasShrinkwrap":false},"0.12.2":{"name":"@react-ssr/nestjs-express","version":"0.12.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.2"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"708a19f7c3f578b58ebcde4491be179c6641050e","_id":"@react-ssr/nestjs-express@0.12.2","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-BhwVxtMZ71cbj4GKNuxbV1syJIy5jUrNe3O/WCwEASjIVtffw1X4VVMLGIyZhnBW9tLAdJ0GL0qCvhrpvEdUDg==","shasum":"293a0313e2d8ebb6ae3e8cdca8beb929ba82a118","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.2.tgz","fileCount":8,"unpackedSize":15451,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd25h7CRA9TVsSAnZWagAANDYP/iuaRhz5rxX+BciCIOgz\nBuM7yPwoeJ5fl5Aw+NusBdp5sRE4UHzr7FO965bIHRNNMsloGDuOOQ/U+KD7\nhEojiX2xFfv/2nPA8Y2UZ1JhiNBlsyBWhXPcFMiuQGsT8J5kMBt8S2EBR7iY\np9EPVUbX/ruDYyTD3oGJqlbwlgsLu9Mbe7dbQUFz+i1qybl8YHinX7tSa9m2\n2e8CSRF45CarTJGpjvf3IlCTmXhmgAdlbZSdCAnixZAKv0PpOf8354v6VKf1\nsP0hRKTOR3Ng9Z+mTUxdkfEF64jJYYtYQIzwdUVX4F/juc6dkkIRYFMTzGBn\ngi3yI5kO/mIO5rJiUijZNGDDQZVMvggQbBn2TtupZ/QfdaIKZ/yaO+GQbHfI\n27wsb6YmGGNhBOoKgJMsQSA1BH4AaMRhSoI+DgU1EPIJ+2mBACuAdU8xSCWB\nvl3chWdgWlP0jNRGvg8iXcSyyKIe3TNiRMWoBTLt6O/wJ8W4DxRghnjAk/LM\ndS0yk0Zf25fKAufS4HzcH73BP0Jd3aQyp0G+kX/DQVeegTX4YavKBK8xfrGd\nbWGSIZy1kPfN+3abgQmIE87wU8ZkSrDCp/qW2nRDDElVGdprEw+KhR6nk08a\np49bmjSZILfnB/877gqEElWFB5bM0ylRHjRdPaydM4boUrp9Pq2OYGUExbbx\nlnUS\r\n=avBy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCRjuA5nP+KiPG4dySugUb0Cg9P0Bw3NCW/SHe/af+OCgIhAKW+Uxja9RSEkQLvgYYZkKF9GJm540gtzhu98vKBRFPU"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.2_1574672499994_0.9919851966492192"},"_hasShrinkwrap":false},"0.12.3-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.12.3-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.3-alpha.0+4fde23f"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4fde23fb0bf5c12a847e43e9748f1c621af3cf3a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.12.3-alpha.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-lQzS5d8gn+zbDgutYS2KsjF9+JTJi44zDaDFkqrY4kwfPPnvcFWatHuZO1+upx812nh9VvkJc65D8yp/i+NmXQ==","shasum":"4896d77dbef11f466b3800594dd4ca4ee8dd0945","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.3-alpha.0.tgz","fileCount":8,"unpackedSize":15483,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd4LQJCRA9TVsSAnZWagAAbxwP/2zx31DZZA/x3UxzwOp5\ne+s3S/bq0b45ALMmxJsB5vQYVl/HpJYZL6/d7yFsNRH6Zax+3o/3SXkq3BJ7\nQFJ5L3cjVr1x4rwThV0XX/jAz0JujPjE6376qfwjehV0RYOCVXe+kCD1p2gX\neeoZElMLJhEGt0LhaH3rSiwWatIFErBzCckY1leyPAWmXnyz/EaXUTxEa9vZ\nEoA6gH/Okce17osW1Vi1kQVdOHzSEUMrtvfaNVCzSFgXny0tOQkTVRC0b0cp\n63wTgkeuMJfVPcd53oOsLgRxCvZ+oL6w8pdamLjK2/Tp82iz1T5dT7dhzmsg\nRIFIrqJanvuHaiUrJkELysouv34liyijvtqGPFR32razs57Zn97fOdHcGFlq\nrqerMnBRCKqtPm646kDcnYmuWDlO2/+60sGBEGraJL/8lxyJ9Wmnvxs0rC6Z\nXKPQ/5lk6l4o0piPUOqPBTIEeJzTcASsqQ9+Jt7Bdrw3sA7BZ/d4/0nkXjAI\npOse9qImxMsYBtUY6b8xd9pHIVmpUaAh+5+qpNoa+7vuQtcIF5putrjmnD85\nRafJlGZWG8xRd9w153GFQkJCc/DWfgK1fIK7XKbjNXDnBr/T/UphJzuV8hWa\nER9bOQVi2HRGx2LBhsJPi3UFfxdMLvki4pOMH81yQmT2oFnpIJ8AU1l3/Xli\nptvX\r\n=6OYt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCL5TVWcsy0wRBOjsRkfA1qswNAJQFfa03dFCS0tBi3IQIhAOBBixVoGldowlfMFMPXPXAa30ndx733b97CqHtbqtN7"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.3-alpha.0_1575007240914_0.5085476496012129"},"_hasShrinkwrap":false},"0.12.3-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.12.3-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.3-alpha.1+33da008"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"33da0089dcb5e4c1eb3b8648f3ae5848bee03157","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.12.3-alpha.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-bDZANc9OrYA8/TSxzbt0MEQb2ll0DGh5IaD5DE3Ku5zmQ7+RWIOEY4ChIPMMM8egfpEZAAkR4UP4DOwUoX2kkA==","shasum":"694f9537251f0edb6d8584eab6208b0b92835b36","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.3-alpha.1.tgz","fileCount":8,"unpackedSize":15483,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd4LkjCRA9TVsSAnZWagAADjcQAKC6eToCMMafuDVQiV2s\nAkSvraAVwpeQtmtS7y2bJQYtsEN3y2kfKc8jK2RZt/kwS+7+hjGPV9u9iwtD\n1PUUCxOY3LNfQVtO/WTYUQQJAMMYQ9DcTkapheT939ybadbi/zWbdWxYrVz6\nwcWuGFhCd14SyITVDmE16/4IeDXWoSRL9d22FnvHd7TPn3M052cYqAebNGxx\n+JQd5tVsC/wp4gsoGHWS5e7y/b+Kcxkr6y0QK1L5Ng575Yt+0H6ZABp8S5kU\n9GTlG29KHFIxxqzi0tDQsTEDaf/7pM8UsIgfdalciawMEg0qO9WTaYH8QlFt\n+nYjraqWuf+u9rBAFhwhraPDNwvzsWNwfMALbeQl8jDAaiZqb9ddbY4kOukS\nlw/hZd6X5TMmG0VvPxmBuhrwzKqilOa3YkYSVffzPtpVo9YoLtAsjCgrxAbR\nR+wqP9+aOo2Tu+rqK+yiYsyhJ+EFZjqBKDS9WvIRT3Voeqc3qHjSr7SWRnSq\ndt5bMB+h2Dy7CyPo5mHE39hi+7u7BiaU3QAz1yiFIS5UfjzehsOKy6RPk96w\nEPQ5ppAROMdVRhT688K7DgVJdar1ygDr7oo+VTfVqY9e05dXUj7K2Ku2ST0l\nwWfQiA69ojxCUtKjVXMqU6BeviRwoCVdJ0zYM0Hfgvw/xvcz7RmoL37BVBfw\nD98e\r\n=SwBw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCPyyUPUMeMe4UPiQaFPZwZi3L+gFefB/N8DdDvaW4bZAIhAIDtOthjyHo2j8XOqAZxGgylb1Tf4Y2dGTmMgmyur8V/"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.3-alpha.1_1575008547256_0.7544417027706829"},"_hasShrinkwrap":false},"0.12.3-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.12.3-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.3-alpha.3+3876734"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3876734dbeb8b7d481424f1e19eb1dfba2d9a762","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.12.3-alpha.3","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-5N1PYg3am2VxEW0m2X6UV8SR3xwoUBjq9T2bwTew6lvv7sUWUCPTr/dlUA97zhOCKg0mcgBdDSWhV8BH/0kiGg==","shasum":"81898ceed6dade95baf3adbc776c67c512f77f50","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.3-alpha.3.tgz","fileCount":8,"unpackedSize":15483,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd4Oe3CRA9TVsSAnZWagAAl5sP/3nDNQirN7mfj/LYY0xW\nYoad9SXwbWGyKhXh64I824LbW9tyZl+sjzuIkfn05aSH3H5niLOtfbCUTMz+\nQvq6pwP210HSJHaza2ipJEYFf1Qf5ZVuK80aAEjDhKG0fkoXdWawkrmY+9Yl\nwfUhzrr2mlbxvdh8m243uICN55LY6VsXCLKCme1RdoYruk5I80L/xM76RZxb\nD+saPMC5/GSK1R7fwOhWVEH/m1/3tISxLkuQd4C40/Wq05I4kHIwHeM5wUGb\ndepp+uzH2At23oZZun7M21onzDqgdAVmQegFLyfBrz9NRDExvgaajVBWJVBc\neiLC709dUHLqaKeKpKPe33gczOIAUc4K2eUinW5o/UwyYuT6a2wP2sreoWgH\n3StwYua37f+/hTNgiYpx9HNZngMfCF3eaXxR81pZHg8r2GPPOK8uIoUblrmG\nwpWnjr1KPfTXkhgFLIRi5SoFXj+OKUa5PqyiLv01l5p9Pweb1nVAc1RcyD0Q\nysREkXY9WMQqHgGd4tc2zQTnI4UG+t+AtkM9cMx6Djdr7WvKCpSwJDnlBvtS\nyVEoO+6mpbD31FAHui6gkLYF+9XJh4y1XPfeQ0cc209aHpH8NVPSkecy1n+R\nbdtEosA/lZH6uKCwDHwmexDd2xvJA/20xpyL3aOd6cyLHWbMLStrt7xLSFAa\neqjm\r\n=ImFS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCA2eVJo+DrYG2T27KDZROR6L4+kcDIPG3va71cBq18UQIgYJs6s82Xh0XbROd88dumwpMlsqZyJ88kr01lhpeY5TI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.3-alpha.3_1575020470652_0.36166819227222513"},"_hasShrinkwrap":false},"0.12.3":{"name":"@react-ssr/nestjs-express","version":"0.12.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.3"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1edf4d37e54d13401e02c32507906d6edf9a12b3","_id":"@react-ssr/nestjs-express@0.12.3","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-ylffz5jxWisGXP68H3BiRGUs25ZV1qCHuCiazT42x3PKOUIjncWU1/4Xi+uxoyQ1bPdKPYwC6zIhL+56hUNlMQ==","shasum":"fb5fdc83c46d381c48fa28e7329ac735a7cb94dd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.3.tgz","fileCount":8,"unpackedSize":15451,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd4OgiCRA9TVsSAnZWagAAaCQQAKNLZZaI/k4E1LHju6e9\n4vuNYcu/kPSmJWCZtQUbo02QVD1hGCXCSaHvAi9P8M74HLPtChXySntYNXpT\nXGFpz4cs+0+lyGyk8wXsWugHCG6CmvycCWnx8ff5h59A2jU2ubri1kOuhipi\nn4LOiIyPvjTizqIrZP2mt0iFcYcdyFuCJUpNstVOE21W/eFeDkh6VfQYtT1b\nwEcjXm7+0Zx+I0FLukByOnv84/pTupSlShWRV9foG9gffGDttmToiT59OMGe\n2q17aSw6pcc592Q8uMs5GUOgMKGfnMdrnQXCS6fworgmiSDo7KSIEp8g4JYh\nw2HVKSHW9O7oayYTuAYwWxTDyeAwSjJQf9caurMO8dZ6dXHxIHgEWAZXv2FZ\njhK4WnkTtJoW4iiWxwneGNS3KI203dRaWw/kZ104mMj7ySt510ex4Y2x6LKn\n3aKWBcq+tzpQ8xhl7GZnJG7XiRClwsXX1c0jdHq+CF4fp7+4SqtnDIsRofzc\nmeU2/TlClGCQ1YY98fzS4Zz34z8b9ZiMD41V0IU8j5ah+5QmR0CeQXLynRmc\nBeXL77+rltuAtU9CgOPdyHSZ/ocbB3IXSTKBlG9ST3YqX1VO1+glP+H6p3/o\nYFKcJM4ztUC78SMxpE1skPrd4jQWclllttiUUn4QiKcbcGTKkFJ9c5jA/IHO\n9xMU\r\n=ebEm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDf2x6ZINbsRPqXCDEkIFAvfVftdfmzD29kwDNem2go8AiBOTIXhOgbZvSw4kmWON8HorvMcCGY8vUkByXW8Ucy+6g=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.3_1575020578196_0.9976009339150975"},"_hasShrinkwrap":false},"0.12.4-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.12.4-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.4-alpha.1+7f03377"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7f03377b5eaa904e00854e83905f5e458c5c33eb","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.12.4-alpha.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-nMJVcbkzsiiUJ/xmUlclCrIe+9a6C89MiFmd84nol9WEaR6snPLmuREu5Wm1psYX1XbbObDDTHYeOT6puAaoiA==","shasum":"bb99519f3168c6fb512543b9f36dd08ad5154190","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.4-alpha.1.tgz","fileCount":8,"unpackedSize":15483,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd4OohCRA9TVsSAnZWagAAe1QP/34iQpkFC8FESElEvTuY\nwqd6P+BBX8425gSuz0bWcu7/KtN8UX+Wyf6zx1I+gxu0uH8hmlPJRejq0Kxa\nYa4WrhOSepQqOUlLA+VCa+E+wGp5ZSAlYPK3TzMu+FV30MMpkuO3xL3r0KHe\n9K9E2CVlT4TlWRzEIoGc4lp3OhPuatSzvYnNeSE13z8adZKyt5py0U0vA4rD\n44zZDPJ/9XHmdGbjYmR31BlVp4kaUmMwFdGhYUb5o+t8jiJbkLElrCi/j/sA\n5dvXbXzsttHYqfxoz8tJl0EMTYDjjgH++SYh09TnIcQm8VhIQRoZmkdne+Jt\nddtJ1hAqj6IwtTmAYkdOu8sfW8gpZJ0Ho1TDdUMlt/RV3owsHCPsTfMV4BZ2\nt+MiC5oV6tOMC6HZrtTNBwWFNX1fCjLCw3JG6uYcL80DtEwmqp2e40VIrKqw\noLFv0BSI8xmcFFk0pIcfJxbwGH34XhWd4r3yboo7P0D1FeGJJGG3roUZMNLy\nfOoOHN2b9y+05uwKtLi7FDtNWoRCbY3NVL8EfjMkg8Ouqwmne8gY7Xifzl1g\n0IsdaqLLVbXNMiEAVUEfWiw5JUs2BmClRPfO3gZqn39JmIVg/yfVq6eI8Gur\njDdO2JyN/i/OjfKVyzL6zIxnyKUs02tyl5cPS6DNWnPSWQgvVV5bpd00C6Vr\nIE9x\r\n=Emcj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDsTXuIyLf2ZQtsmoFaLbXPinuJnCV7d3Yl7RNxZMBXlAIgDlgR8YfM9VI7G+ZWbi4wxcT368VTnEnIeAP3R2/JU+E="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.4-alpha.1_1575021089122_0.04576003794143779"},"_hasShrinkwrap":false},"0.12.4":{"name":"@react-ssr/nestjs-express","version":"0.12.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.4"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2f15ad8760b94b7eeb7d34db14837ad027b006a4","_id":"@react-ssr/nestjs-express@0.12.4","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-EwMuqvi589pZpiX8W+mY0Ab+FFyC5FXZDNEWPvVta+MsqPNXKuGk7TI3yIB8GnBIqfZ3U7xy3R4eGETD17saow==","shasum":"901673b804bbd167d327938a307396494ce44e2a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.4.tgz","fileCount":8,"unpackedSize":15451,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd4Ox5CRA9TVsSAnZWagAAoUoP/3qgzot+rEGJz7oWdHaJ\nLfxu9WF7qNKLOFNV4brrb1CwtbCMZX2MbQVbCp18sLjUbAizamGxw9wwx+ug\nuIJP217knR0rGeaPnO8UqMRmJceNk53bnWyUscey5BehCJVf17Fo1Cn2rEyJ\nn2b5BkUz4QeEjyUkCXG0Y9HEDrMfAeki3lSOUTLRO6RnootSlCCno4P7vVG/\n2owvqUxN0HjqDAagt7r6svy4R+VHGgLRbTKBUglhwXe/Fk5Rcb8JQzy+4B0n\nn5uUDq/mkdm7KnqAVZ6/RdSqR4yCM3v6EgvA0le+5MMlrrwCEgRjyLEN8o2a\n79HauOziLJ5V6E+XMHoVtPaVVJ1IXqM+JqmtmyRQZIfpSOark01HaSQ3L2I9\ng4WSBCHZny4s1gP79g8xx9TUF9FbCWqAG6+/CbLIJQHFmGR6kDYwzk58HVH3\n/EO3i4Tv4X5gGiqCyH0W6T2gZHnmCMwhSlVlpuknqB/WFL/H3o8ZGkJRCH2K\nRj53KyDllKaqMcnT3J4j85uQ5bwSMt1uNSv9pKsRmmv3G46Zc6e5AQ0tls46\nl+Iz9yuuBSZh7NYdepCHYWV0wQ6pUTYIF7gXgX3MWTbf3omB7p/a2WyARAR8\nlXdw0QDUEcY9+psF+8WVvs4lLAdJTnLB+K73XIdiBlBwzSNFlDrT4YrBvKiZ\nZ2va\r\n=7U3x\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDLmhfunNITLm4F/sWpuhRlag4KLDvYseSUI5l+TW+siwIgRmwNeq78uOYoiaNCy93MHL4Nbc6dfqLJD7O7eslQg9g="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.4_1575021688881_0.882626121694768"},"_hasShrinkwrap":false},"0.12.5-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.12.5-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.12.5-alpha.1+d01afa1"},"devDependencies":{"@nestjs/common":"^6.8.5","@nestjs/core":"^6.8.5","@nestjs/platform-express":"^6.8.5","react":"^16.11.0","react-dom":"^16.11.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"d01afa16c27fa75f0e52a707d37059963008663d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.12.5-alpha.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-9+eUFiNeDckLxUIxKyjboiW0YOU/lTtZC09vtAsmwpvx/tjPcWJn7Oa1Syrio7CtCi3tEW+R5er/KtahX2aZfQ==","shasum":"96859273bafd1b2293da94221253b92a3f7e93e6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.12.5-alpha.1.tgz","fileCount":8,"unpackedSize":15483,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6HryCRA9TVsSAnZWagAAJ+sQAIXS+2vUlyRhg6XDYQSy\nUjW0kXHUueeP88oCyxEurqpbSo7ZaCmpaVaRBWsueiDMjj96ICtz6FjYTa2H\nq8FS8Rode+6E2TCjGGSPPP36oQwatIBdqPHvv4FR2wQyRv6RsQ/oHVvk2GvL\nEU6cRwxCWRe6jn++xSR3iB/mNz4fJA/rWuhizdNO7ZK8s/pLCRjj7OhQVoXt\nNojxwxrE8T2BmEDYM3pyL12STFkgo+89DQl8EzDph3QJx8F4/LefCQ+VFX6f\ngM6PUcodlyEFSCzJkcE/T55+U13CeExfn7nnGJY/r5VQJCq7UgIzV2YJObzQ\nyVcXLm6DCJqE00ghOp2j/ONWYb9W1AsBaw/RZ3vrND2Hi6nWY09D46sVXY0j\n+bEgphXYBPHTSVLX2ZHIxsnjxzG3zLZuIWb/xhx96uyVk1rbRYoF2G4nbAY4\njlQX3M3WjX+8FKjygIaLF0eeLPh8eJj3DzWAT+RSh1z+Hz3zsFnqQJXxFxfm\niQMJSJKLtfH8wOsATAjHd5RaZdQ9lRUlaksSdQlSBwZWzjt8RiXFClwm0+mx\nHRLByE7meFe1yzwx35ZHcS73+rzvTXyMFfrSUpewD6+yNEe6ks1cBP0lF7Cc\nlUZGjXLIHKE15BQbqdey8q5NC3HRjjHSOJFjguW36eJv+TD0SeIw1GcaGjfd\nJubS\r\n=vftJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEX1I2TCl8uNInzMsudUbz06WRhGYTv9OWCFYfFhHFg+AiEAnapV68+QeufZdiPqCVRFQz/PASDz/XQ1iI0tstU4FC0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.12.5-alpha.1_1575516914051_0.6760434363420049"},"_hasShrinkwrap":false},"0.13.0":{"name":"@react-ssr/nestjs-express","version":"0.13.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.0"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e3688489314c9ab9659876cc1ba552736e7ec0d1","_id":"@react-ssr/nestjs-express@0.13.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-71Xo2sqVFjRM+0B3OLdzCfAxOd5e1KkhC+9jr/0SW6PPVJj6ne8/5gVDfKRLVuJRuxuJaOjwXiUoE7S9NDx6Bw==","shasum":"af3b430772235fb59fe8dab5424ad89efd4577f2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.0.tgz","fileCount":8,"unpackedSize":15454,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6HzGCRA9TVsSAnZWagAAvjwP/jR6uiszE6j3xCLSK6ab\nQLw5qpWutP2hnF42MJ9ok6D76Z6k+KZd05fG5so5bnfWogQsbwyyDSlXdbAi\n68/WihC8We0nEa0Kf0MkuzmoefQp+0lMIgVLLpXHqMqmm6ZT0T5HdnQJ6nWH\nClDwuwpNiOPOvn5XqHIa4jcNEdKIj6yfceVJ02mVPWWKiu+8GxXRw4WHdEyb\ne1Vnaq0mxEaavm09WsibvkqpWfD5MUFxgBnfwGizPpf/Rt/j1m3LeFuwpAQh\n/39Jd0Q9ihY/Ra+f19LXJoS6Ds5LTj8ClPd+wDnMZZyltZxRupox+alNL59J\nZIbRqxj1L/XSvKa8qKRsLw+KvnKQ7yWXTmHjU8eNesxqiZ8N5IGro+fxP8hE\nJNFwH9Mft79Hwj5VwLGaMkoWxH8XO5YWNOmHZS7JLTQzo3UAXsndxUPoA8F9\n8hGiGxyUyERVwBDq9r0EaFxWdc7t8OSicTzVVsPfQfocOKHMSX7gn/xfYO/Z\nQEqDNOcBe0ljquKbQMkUEeh5E4MIDcWfe7xDB3V2tchhSI518oyv2PPdGU0F\nTE/hYdG3j8SyQvN/mu69jkrPIDEOzifuw3STwZLiBqEKH1EyfbWOBoat1qhK\nq24ATCfdYnq7I8xVh4OUNwmScIKsYuqxx1TPArRt412cYJAZrreYkthz9Mzu\n7ut6\r\n=zG3j\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICxCdLEDL727ZLmGUVyLlFHXEVWnd6wIsg4ZSEKfq/zbAiEAvAWze/2nJ4q/7pLSlBF47d8qjxfnY5W7cBP0T1cRx7A="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.0_1575517381797_0.6376660457538765"},"_hasShrinkwrap":false},"0.13.1-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.1+46233ac"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"46233ac5f50f6c0470ee8a93e3dd9e576b43514f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-VBVHPovCwu8J80UC5UQ6VuUr/mN4ARxpAULjdIbsFl5dANnRXc5UOm+xWlP9l1ULniTxYsEuB1SfL/7gJx9zjw==","shasum":"3d316271da8144fe4e65140e872b9c520b219a6d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.1.tgz","fileCount":8,"unpackedSize":15486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6sttCRA9TVsSAnZWagAAcQ0QAIoInU23whT1Z++RgSyE\nNC81l5UXddAvUJCIIOcGixtClX4u97H6YBzphKORp6kkFYHdfEEXzTdsNazi\n+kso0b2IzrDDFR+MTbnjtDvTAGjRSqaby3kLa8RhYcHEuu91OaodBEdPYtQJ\nGPh/rFQ8y9TtoKphNdSI50nIih+7iecSRNZIqM1SKeDrb0PoX6hMBBAknX+P\nX+4m5wO/6IkbCFqRiCVnHs6Ba8/hE3uIVtLHkp7iF61bzhZFBZsJSfXQ1f85\niO9lSuO8Zg/kRlvGCogiLh2UNspgYB6fyZn07ykIJ8/mkYj+uSAxMoc6gNGR\niU0vqnTdjoSn6okYmYV3CR2+stClALQRJUByQQtHBDS2qail3oSWpbuj/Xil\nNlOyMHts0ZShWMTrvDKZXuSXhTuRgVl23bpXuTCv4ZIM+E2kCMELfRSWViHh\n0oB1EiTJCwkoK7kgVKWvD0c1Na06t+b1cPqyQBNfmQ9EnP4T8Q+SZ0QqXmPE\nkAsmGCWxnPXyQt6V6m4JTCae5C2TYgEn9N5lJVefiBeL29mpjRyqSBt9g6B8\nUrxUVX03f0UfoQVuKa6eYTLzCSJUthqR9NF1dDs4CJarJ8lF2B4EUGvSnsTc\nJ0znpzq4etKjrA4xAt/hvKvR7ITeUQ49CTTdjdxI/mM7bvhvL3qurdB4O1d2\nhnSx\r\n=kxsy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDbDqPebEC8DSfgejc7aE3AnMCQboJ5f8bzmNWjH6QECgIhAOzsMGz+PeiOuSOZ+XVJF7bBaEnrEihNH1cG/gyxEg4u"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.1_1575668589267_0.7134237428784462"},"_hasShrinkwrap":false},"0.13.1-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.2+e987c2f"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e987c2f1a8599ffe1004f1931581f55e4b395002","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.2","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-7ptwCKG369alWprP+gCdZxSBrYoZUI0WDniazW11un5v2cDgSzf6asifbDvmeiATjCVLeeybeoGDIiczyfa+/w==","shasum":"a7a2011ba0fadc1617ba56c064c419a7dbfcd5cf","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.2.tgz","fileCount":8,"unpackedSize":15486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6swoCRA9TVsSAnZWagAAIcUP/R0o9ifXVUL3EWCQQk0g\n5OuyRbL9toC6im1OjoHoBuqE17izdanute7RRKkNUZFf8z4lp8c7WwiLxX/g\nCeNBMN2iOj6C6iO27yiGKJGbdnIkrdA4queTFR9vPU5VKFrtiKN27dndwBMX\nQEXQW0t3mIVC3JH5rlM4O6jj6m4WmtPTasxGZV+HUlwfLV+YhrlMLqUwD3yR\nfh4LLiUlNuYaPnByeTz0cDhl5FH7VhMtApezi9ZuenZavEDnmvU1XQqOn5C9\nuGkPxKpTQUQ+u3tVAII1RIBtP7b4CJ1OXndaOs+/bFxSy6Hrh4A3oZGyR6iL\nBNyU/TjFahxCxY8OC5yVSzPu3q8OtKHqNw9T9w4eMi66lYfbrDN9osw2CxSM\nbh1p1Rtsduhs7YHzRuDXbfIIOanltGvuRZzIvtv3ga2V0i6nqyA5z85jFVGE\n/LzOI2oWal4xhkA3CFYG0NVMaF2tsFRyBTtQydgbDrlAcy4c4T6WF/+2T9gk\nDZ8VdtMArm5Izl+oDj20o6KjUBqhsEYRgn9Ce+Lo/frP6Jt9gnccdMiFdras\nIG4dq/GRe+6DyFPnOGHyYwls5U64ywCuL657h3/q+3wMkFcAkE4DHMtQgub4\nB0h72u+YTIajvLUaDJbwu52ceEBb28Lmr3IZboc61Umj1k5nlFw/JBkVL1a1\nX5Qv\r\n=7MdS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC6mqpStPHGS0tToZ7c8sauxTgrtry+bl+QYIz39ho8SQIgdMEpWFJcVexONW0aw17x95Jbuhvc4GSG8M5gX20Hw+g="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.2_1575668775626_0.8861622018503035"},"_hasShrinkwrap":false},"0.13.1-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.3+ab9b189"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ab9b189da5897b6f8c7f5b01c8abe2425b8ee3fb","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.3","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-AG6QR1hFvlkdxFN6GJUELtG9IOGhrlZahVAy66GB874/gvKoU5VdliLZUa3KLL+D+eV4C8Y8/fRMpY9Nr/Qnsw==","shasum":"0724b77a785386f03080f2cbf0e9a00e38c5a9d8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.3.tgz","fileCount":8,"unpackedSize":15486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6s4dCRA9TVsSAnZWagAAApYP/30rcExZ2b0WSKYBqIB9\nxJ1UD7aqIXTaJtNuJYSVj1n2ZozcIU1VxvdYrF9ArcqD2Ezk5JY1GDmfTDgZ\nIXeJju87hgURFh9WnuLQdoCU60AYOQbXVc+xX/939hcXovuUNhmiOW5DDsVY\nZd4zNcditVf81Idt0yD5G0KhkWLA5h4rnUiJXpYeJchG1stQ/wXItQnBd5Cc\nCOEix4r/XnKMKh0NPj61pgT2sEVF8Wc5iWCz9lTFgzg7PlHlUlv9lcyPxJp7\nq7ipqXqNeP+opuUc63mdSs8SZITjeET5Ob5O13oksDSvAhwrm6lTf+GRNrko\namBdgboTC1wvDeFpmgjb8soDPOKYu+I26j/7ciP9YRz6wy/0ecW3qaPigWDG\nlDH5vpSDal3S+//iFaOLYwD1r/j4jnHMg2sJZUmHu5HXBqWr/kTQoR5un+96\nIniJhyjC3LN/iGXjUUXaNahJTy2fq9E6wTRmiMI943yvnIoAqGa3g54iXi1W\n0TnL89/B1zMR5xiED+ope5J3vbfK11OCFUzXXzZsfFjTn6hBgg7ETRkC0TNB\nws1KMpLzdsN/kc/jBYKTJsaJlr8OM8bYi7TmZfCm2GoFc/5Ysk1oE0wWTPCf\noKKw8OfsXwa2eCSw1R0LxzFYsWaVP09fquKJZZPMLPtwwvd3JNreiAsJkwNz\nYDdD\r\n=7f8Q\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCPL5tiWGbow3wRr4w7TAZprxkrf4CHy5WnLUS4dDoZOgIhAPEP5qs5DXgrfMSVIYJJbB+8m7qZcI59ry4a3peXTu+/"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.3_1575669276590_0.04582667894115455"},"_hasShrinkwrap":false},"0.13.1-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.4+02cc684"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"02cc68490b83f4adf0bb2af4a7b067cabf763427","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.4","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-zaQRrO2sKAIJbIIicfNJDVfjRL6HXeIq+/NHSFe5wFTbCbfOkKaYl8B+JoAgRFiszAiZB9NI/F1C+d4JYHaQnQ==","shasum":"3b5602304b370a39a36bcf4edae73e244f4a5892","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.4.tgz","fileCount":8,"unpackedSize":15486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6s7TCRA9TVsSAnZWagAA9ygP/jtujSRcm6SUUgiA14+T\nM3z9BvooYiWXzeVUT3wwDt3oGWbyxr2sSCb3FdBfZJbcQGpnRbh2uhTJ3gUx\novPTI+zwo/iEJjMSM9MapXIzIdDGWNW4Z8dmm1E/Omk0TnGsOdcTnGB7hLWO\nE52QfjJKVyfQw0oK92F3gTWeEjry9/9eB2ZlDe371x8adMR79Bxc3dkCHJi/\n7e6XmO4EKFnhcYPwrfU8v4TYO8YjpFOBse5UKS6xZR/NVF32ZuqgzQ60rGMY\nJS/GUj9c0IZL+vulCec19lYiSjEJetFpG6BBs45pcRs1xfx6hz3ammhX3tn9\nKNzS2xC6zzEEe3Fhjufr8dbA4txbggAjksWvsMEQNdkmJ6H75qMUME39bFMx\nkHVFc53mNctbdrhdUGpD4qdFfU/Y1Cw/P5F7uM7RRJ5m5XIHBkMLUZY/AfLF\nM/Gdr45s+1Es2zE0EKAyLUJCp/IjTVLUP60YUo3ik5tTaEObYVE6d3vL7B4D\nGk4LdF3gXkdSKfqGBjCDL+0J2d8EaiJRvRWYIcPvaGRVjCITtLigsDWtfZd7\n2CpukDvsvcu1Eq/mEjxBBRBssIqWSY7aZBFLb58zBMmx+u4QWedrEEaAMDAM\nq64ic1TPXYemWuxenXuKyWHMP2kPg+0hrCCHiX0Pos22MQ8/Yk5L6V0yPZmH\nxuNt\r\n=N1iW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCTLohjByrNPqWr2fV1xb+d242CCql3r8K0hX4cM9PSGwIhAJO5/PoXRYdCp7OqGgSrtN6isgfQMgU2rcQ2MFHgMWCR"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.4_1575669458805_0.9222232401925397"},"_hasShrinkwrap":false},"0.13.1-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.5+bba17f0"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"bba17f02d08c9686be113355a9349be00a4789e2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.5","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-HRp0/M7NoaRzFCjProoK/JAIKXUT37mJvElcUi2H1idaqCqQ9fTR+1hVbVUyKC+rbebrlnXjKB43Z6MeVAYoyg==","shasum":"d9c73acd4b905994d3d14d43b4f80abf0c36cb1e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.5.tgz","fileCount":8,"unpackedSize":15486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6s9ECRA9TVsSAnZWagAAn7QP+wVkF2+UO5TfB40YGgub\n839i+jWCmAZNgbJ2NJboE0Ay4QoaEdxoVqf6pAHYQ047uIT3zjHcR9TzTZ39\nSH293q6nANHE9pRK3kOp+tXopbqihKuwcaRZq6pLel8RZ2XgzVKq6qBpR7nd\nATz4UspT9uQjWcayKX8thDpZUOd80GLVMcW4Tx+NG8RtmR8LL0HB9q+hADxX\npO1SC1nWMGgitSZgUmhEsFai8oE9nIqTJGER9oQs8OXZJgbWrUHrZSuDVRjU\neg8DoT21eyedumgMYsdSTa4Dt8wWGAX2zU88MI5hJ5LGcPUmlCRD+UQbIfK7\nQwex7kJjdMSK21eO1S50bPJWqVR/8zeAzQ3diRua5yPPkEGZtGpC83pNCyBf\nlWP8OZDCPXAE2ywNKQKt1QSqUAR63z9OuU+9XIRNDwbKs8Sx5JbflsPP0s7v\n7ZbGxoQJOkez/epkXiyyZ6DpzELMDtsx9vSBnwEGflpbYmepKWRvdcJbVhq1\nQ3WvnM36hrWaTWQCCp6opkpmbOV+jefRYLk85dmEhibTUrLnYHFBp6jATpmd\n0c9p/DWvKiMGqHflh0SMboa2tT+IsctQVjrYyJAfftjy1EGeojUTtVXXxT2u\nkJD0+XSXIbtKtjry8/+StB5niXLVisjwrqag13LbGZAim0nbGwWTWxqANGbi\nh/JZ\r\n=0Xej\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDRUvC2lDhqeU2ut8wEextE6AD/gcaHoljjawuS2SZygQIhANejjm1eM3pSHTsDFby0U4iiQHAGgFOMYEKn4WA0cxZF"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.5_1575669572001_0.12780816023715813"},"_hasShrinkwrap":false},"0.13.1-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.6+729cf7b"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"729cf7ba9985c9c47c9c8dc3c7613880ad0c4517","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.6","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-vsyAS/hxVAntWVyZUo20s7UA2/UPRjybOD2iAMA/gJGGqZTdl75aK1yTFRoaoCDzw2CLnA6xHp/SvirU+fNzKA==","shasum":"8bfd558d11519a62d9b0739ea0f5cbae57ddd907","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.6.tgz","fileCount":8,"unpackedSize":15486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6s+9CRA9TVsSAnZWagAAIsUQAIKXYJS9BJ7qwHgzkCQR\nVWbuDuYvKKXtSQXZ1pGS0fdWM+n9N3vO2VtArumx5j9dr0UMKY/Wy7n+/XNq\nREr1q8DqwalBOKbMtDkGt3mrLsc45S/1EkEZWWDWMoqeZ++BEWRVp4VqrFVN\nrtwrd0poCTAZOnFap71dNHcmunW+C1l+95ltaVS7pTAi8a1/lCzwlDt5lZzq\nbg6swyRyZ5T9gEtR5X6WqDNXeZOy0S7ceJ4fss3+UW9WuQgmmFIa7Qdr1+Fu\ne/vbPkn/deSSmlg3zr6TMwpIsLbkimeiZVPjvr3YKxsu2NC2gAdNDrpOxUZc\nddV11WQtwQMsu69Uaj7EXXXQttgpl2osNyjBX9c6swavkS0WvtdOLcnT4VTD\noaUNsDRjtIZvlQH+uqEaaau1nAIsKKDzZhtS2Y4YTdp38sY1uCQZBZG/mmm4\naXsWXmGN8+D39ahi3cn6oxFgN8JLHetR8XLfI3XrjDcG6qNtvEY0E+1PMLTi\nz5xQKBtGl0OtnkKCAfm3UfFInKgEn6qigl5O+px3U92maHU/II0k/z+4lWz4\nOgGJt7YM9RrhjkHt5Vo8pJT0z9+OZoXemF6x0bXXe+xQUJFabvRiXEn20Cy8\nxrvhhog21O3iUGoTNzO6Oa9aEzSfy20trnvbWlL7+TzhJ/qxkr7DvszHuGTT\n6Jgh\r\n=alin\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEMlXiKMp4Y0GBL/lCsQ4IaHaC2jzzKqwnZEwOUzWUn1AiEAlhTuTkT6Z6BOPqb5XgORtRZKpGiZh4Jw9HzHnm9jjKg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.6_1575669693151_0.6835949111971424"},"_hasShrinkwrap":false},"0.13.1-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.7+3b6724a"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3b6724a3535ab0de044c3bfe023a4bd2d82a126c","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.7","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-4Pyyuc+Jxk1dEj1RkBakynL6ygTM6p2kr202AZtAgrq8Mwhf+cD4ajShs6nS6eLyhGbME3Z+fHUQv70Fdp7Pgw==","shasum":"498bf45389b9b0605bc4b86a8f08d3553bc2b69d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.7.tgz","fileCount":8,"unpackedSize":15486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6tBQCRA9TVsSAnZWagAARmYP/i5aU7IKMVJ3YjBPo2Ah\nSj4kI6pGLugmNlqdXvcnONp1gNnXuxG2RFbaa5OvmOsJQ7rZpCUdHksDAqNm\nxpC7Q9vPxLlNrlQl6rzaonSrTLVAcRUsxEMkyl0olOAwaTtROoDnVkGVnD/w\nktVh2ZplZTnPEbV0AJKg2Cm4FpHHNDeRdZPXEhLU2qXQjuDt0secxIpOWpvX\necFCy3y29WhmGMvWQsAkx7rZSPTKsDN+0wbaSSNcKypcZbOBGZy7zWScZ5ar\nRnQmO6zYNmNuRgmlAwU2s01FCW7rBbwhPCHIsg73CZthWsV5j5uv5XgviKon\no4bgXzBu6fO2JDbcuEtK3QSTLJp6PsYPtBPK550S/vrEfEdXoZWlkfkRs1us\nEZHpoJb99rTwEH4zQFTn5s9jDCEGyqeo/C++d1U0RU0oPrGbB95ccIyh/MVR\nI5R47Y+cKpwu+7mj89H7uRAvfXmdZG3/sedgKKQAjKRd54c43Ns7ctFhdOSA\nBKIpoVD72mbZS1ewVhqD5/fSs0Cv99rTbuuWmzl2SMI5DUrdB4xERMwxBsID\nIe/ZDVNOoQDu+S6ah3R4A/I7U4K3lRPD2kAIxB4kN72RWQARcQEOAM7GVatO\n5Ld8gUGkyAImWWOoqZGtSzgtVZoaVOwslSQUnsbb7AAIGVh7TDcyjvfrXKJI\n2whP\r\n=CpWG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHlX93nzWJiVU/D8GBJnlJg/rZ/mjB3FgV0lrANnXYBxAiBSM8Z6DVwqyR91e37daWdW0kEOdkswXLDTVeYxDu3rtA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.7_1575669839781_0.8997996424995967"},"_hasShrinkwrap":false},"0.13.1-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.8+78d3567"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"78d35671067c07d44e231a13e5263a423c685519","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.8","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-sEwKSWYen0rxLcmy9iA+7prnYrMJGbmusSVhGsEnokuL63hve0QwvQwOxjvyMhYTmNup9STdgmKkjo1pTvDtvA==","shasum":"5a6b9fdb4705d0df0bc2da4e4f1e28a41d9481a1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.8.tgz","fileCount":8,"unpackedSize":15486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6toFCRA9TVsSAnZWagAAXnsP/jsNhJ9SdHZ8aS8tthZW\nJl96owweY3gfdl5ZoojNtZjXCzNU0ecQfKvQ63+6hTFURQEbBSYHi6Vk6+Kb\n2jUuhKL6ENNJQMsnLw+EKeUeIy7+TWlDzYMUHujp4EpD0cwVf3hXAWi/BGez\nW98m/XLmLdvLMBzo8/YqnI8UvyKBLe/ywCG9hbl67G/gFBlbSFRePeK/K9fw\nxOIXy+idp6QPgVxiRQQBxR52tPgHSWl7P+UPysEneGQC6FxJK6RgmKs79hDl\nhyZ5y3DX8aOwftBTbgsYt+lxdwvK7U42pCyfvFkElB1+QWsanhpyI9erqTez\nkQzjJsghPZ/55okliGqlQHVa3k7G8QLt067jDNuRln290m1B05yfsCHXOQ62\nHYkhQgSdEa25o/O1xZBI+d9k0T4WtNgrMgiln5JtjqoenlDnGbe7ckGQSTR8\noUrq1QarnhXoSiUptaCO8mMi244ovtrHJnjnyPKToi9q+xqYcIcMD+2qiHx1\nVxqj8Ttn0K00HSbU2bSl1ouVYyD8/0495IzVXL7cFiTTTuvs6poGobuVysie\nhnNgGFbVV9gd8nmqzFnE/oodo1sbEn0/8yQOrHYxM5iFYio0/Wqc0TeNA7Fa\nq2Ochke8CCTORNufCC0ECL9sTvHhJZzmGtKz6HlS2YQ+Dm2STTSHu4/ZB+D1\n7nnR\r\n=muc5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFE/z+bEP+z7qu7myjxKwDzZ2221/Si1ARmD/nZ7J41yAiEA33NGO6feHTj2Yc2r9H1+aVuXP16K6kG4LDcH4Ak9/GU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.8_1575672324882_0.6459907154933746"},"_hasShrinkwrap":false},"0.13.1-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.9+860c5ec"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"860c5ec3b47bd4a3a276f0b752d6f1e6b01abfa9","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.9","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-Qbh7jNTuCzkEnk6gKvgXLXBGlprhQS6D9V3vrNFQ2ywlXCXF3vBUrw+cu/XRG+GvYsFnu70A8VrFGFLyrRVeHg==","shasum":"d8808d0d606fed39da3141dc9049add26c534a76","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.9.tgz","fileCount":8,"unpackedSize":15486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6tsICRA9TVsSAnZWagAAbhkP/iQpAVtlvtyS6Um6NL0F\nyAhL5eyLF9gsQxg71TZb6hiiSK6Qn64l7XitGFp9dKdLr60bZc2PNbEfDDVX\n/7//KTdHHnX+qxDqOXyec762U9D5NLXyVMxWATG62UKQjrPJkiO4LMRJyryi\n9xKvxGQFPrwZi+a8w5EKhqf0fXlWzBviAcPQftYwTnH66CLSb7yh/3xOQ6oB\nrssXk4WYfRScMT59huVGAEvZXEb3A8tQUdwO2gQrfVi6QULNRI4TA3kBXi1f\n8rDysULJnyjDGpv79Kjy3SepOdxsSloCyIp6iY5L0LT2Qh+Y+1ak2fJx6jMm\nDLCX86dBEkBHudk9oXq5bqi6Rm52R32FGg93ldYMeixrUGAxkTLUtDdt2wnD\nWzXy+/86ETeosnG8Oe4Vn5LEBxmvU1x7MmfpM9zUo2mQPyeSyfYqc7GB2Zyv\njt79Q/25nVoooQVtJXu4ceqh9+DUfYVUVtIhVCJkaBLkRcAC+14MBkGVX5Zd\n2p7V4TZp+C36/bZZIQ63BzRByHpyO6unNqmkwZeV+IOC7ksPa2m32MBCgFyt\nLlkeIm9V7pCkhh06tN8AIoueJNBeBldT0qWit8OK8Mig3B4T6CIT09uZ2Y2i\n6/9VtKmmPJG/xhsyxxoaaFo59oXhdT4Dp6lMkeSL0SLaeerNOVe6yJQVte8x\n+q96\r\n=+Z2O\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEQEnZ0Xb+Qx7BCja4xL9SlSyyALbXR50wQL7/Sut8LUAiA5iNQwVKl42NsJOqlJS/J5XSiMZ/umDNlMhxXGyhJe/Q=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.9_1575672584092_0.6708685655097448"},"_hasShrinkwrap":false},"0.13.1-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.10+3f85ff0"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3f85ff0bd4cc7fce1e0b58fdc4f74a98088788a3","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.10","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-A2sOzZu7CveUciwyM5ybYmc6SDAo6s5qGl/qxBqkBYdJclN736h04Xt+1RznD6v5/+tKxOjaPcInNtTu1cLUeA==","shasum":"52af1c8b8038b4377c6c2d9b6405b2cba2326ba9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.10.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6tyYCRA9TVsSAnZWagAA8RMQAJBH/ysK0gZTSEvLRMO+\nVgniFCT07nJDsPvPIpTfh2Lyvx5aPQm775b6y0WYkiI+AmLBG1qdanKM1/m9\nga9jO6W1Ju5DulHda/EBnuUdQbIOxSw6Z7oYhakuugRodZkpiVqKB/l2badV\n1PSsHY2G86vwZpROOqLV554sUBd8Ok/Kx4/DYyCZbdI/Ty/6HfBNWe5swtOF\nf7E+oOAdjjh+h7dfPfxpeyYiSqOQZ0YEH6r5kL+ItAQbhpcazjIV4S15lbY1\nsmvx8AfB6vS3HKeVBGDvZAwKjagsxCA3d0xPAQtriLLlafbX0apqfwLHsgkf\nDrpXVI9PjK/m9p5prqOVcqsVhZilM7looSv2ai97Nz/BCe8pwmJSHMHx6VhS\n9BK7WhpPs+uFQWXo1tbNcrp2A9f/NaD0W3kxfPdBjgzIPEVky4EOvk3Nn5DA\n6sXxpOna5Nphhyd24bKt+iXas+fMj50CvjOI/DQ9twDsyKG9XxZFean8THBP\n6P7dYUO+BHu/pGQyMDIpxhuYT1ybi12XYxK5XKne66JUfd9BbKsH6kyahPMu\n2Z9W9HrHVchpqdTQGIIRD9904pISwHLLbfqoCYwMPJ9RRCaKQ874sFmcTfa5\n9rt7N6ZKNUQ6ZezGBCBIkvYqaItojDYtUN8v6rdCi1u9tuEBxcgsbgBvCKH1\nr/8c\r\n=S6xz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD29XmnM7ZaJe993e+Sutl0/+rzNlGBqY5oBC0DFCiWFwIgAcFHuKyiG8IwYFG8eeKBLbQ/+6BaJl5PsQNm52MdTEA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.10_1575672983909_0.8028133777190272"},"_hasShrinkwrap":false},"0.13.1-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.11+47a2c65"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"47a2c65a2dc0f5bacdee025101f0c11e4bd61a22","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.11","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-mq7fVUDdh2YWF6bXbgD98JfErFVXBW7OEYsOxcrARn0V65S904EcO/KCCOmMDzdaQ5eQysYqnvgTkG7dLMfLmA==","shasum":"2bcfefc411c943714696436f7849ba671ed0ea14","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.11.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6t1TCRA9TVsSAnZWagAA1+4P/02YcwLFJR5rP2bwAOh3\npGoWGGTWipYpM8Fw8yRWfxdVS+kpJy0QhFa00jX1dOz+VoWCt5kwGVsRFfOT\n1RHXBVF7PvXdAGzGLxEhs2CgIsaQ/KuLwTSNrNnfNDJD4UXmOLOs4aWlHmk4\niXd/QIf2+vYK32ibTO8jNJ9fojf4BDRBTDCpvhR0o7qOFbGjuVV7U+ooPH1Z\nehAPz7ulU+TPX4+RyPG2xvmxJsIVNiuOhkPzauPTupNuVu6yI/Zy8Yu9AnTn\n1Q62c6EKzpUNvEhdU5mrtaf05Mn5NfT31ixkVgZHgf7NDbseZpKuvysPp8Iy\nBOhfB7A6s8jD1z+1DLVHCazfNRPdwcHxfq4VhXfpm6utnmnSnzixZ2zN+pLx\nG7gtEL1YmPhCOSuurcrA0LxBGGXqMRUTPB1hOsSZtHdmW5t7bQSgRbGejAnn\nYllysasIdO1kCU/FzFFgj6eTqtS2hpryg2TbRtNQHk86hEQOXmSUuCylhoqd\n5M/smK0Gart4UVIqyNBYab0iCIouVJlu7IrU06oJjzNM3xLNfGWMgXG0Qx1z\nvMzazsyOQApJfm1YCaRRDmZDKLsbIeat4HHhA29zWKJq8qVQ/LY/x2DnD5Dj\nhstaWBgKUG4miKOZ7j+O9mHP9NGD9HhaArI0MrY9hIN3J95UiF5j3NfNgtiR\nuzPO\r\n=ZG3i\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE37JeJnG2+ThnJvmc9GAubvGk/xcPoTjHE0qG3P6/wyAiBG94mc1ZmukXvMAHOije4amv1zfSfMGfuvLIZkPtHB9A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.11_1575673171460_0.5738182048038727"},"_hasShrinkwrap":false},"0.13.1-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.12+550e3fa"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"550e3fa0c177fb8dd60bf3aa2a179e406e2e7a6f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.12","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-tk/UblgWsUjJFWxgMT4/H0Tyrs0x/ciS+6Sr/A83x+LNqY33SmAwlPujVzvdO32w2+ThXI9NnjT/jSVG65rDdg==","shasum":"7adb7b387cfe30cd164acb567c48284dcefb69c7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.12.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6t7RCRA9TVsSAnZWagAAATgP/0nC18wnyvUX4OHMfu81\nzdEjJZZnmIKRZ6GIxIFoJOWnHyPU+ot0mTdE0SupB74JIdHkn4nAyerNuykZ\nwi7CS3h8LWJnbPw0ScjQxYzQ479Rds6kpPZUCCVGmFdZgHmSypr+DmWzcyBT\nNjtqe3EOKD3gLO9UOTHBNViugSEyP7uqpXshUpTU2VMUVu6wt8GY13UKAjqT\nosRnURKvdL0QlO9tMPWVLWVVqmeXflEjYL6SsX1/qQzZlGMEiiCOBNH0+RM1\nnk7S3FlyY7DUfqKG+FBD1aCLci18CtcwSnxn0aTyCsP24UFrQLtdhUrJrrsA\nsWVsLSnjiZtI6NinGtLjF2IT9BQkHfo0ImX+sZ4zCvKTOLHZrzF8JQGQDIKI\n6U3kt/prqVqYJdjyJm71mlJFbStPMYyXMRfRC2NIiKmCvdVIdh62kVOKY2ZO\nza2jjSvi4KFTjmHNplP4lD7TkYEuG+1hSwuXXEO3b1eRpdx/Fn2B94++Cg62\nymwMkU04lP+K96J9tjRkpzFx9xYEg7ocJ/rd7B6WZIGSbYlxQnJYPUTz5kF3\n4OilVvDyGcePtOj5FqaWShzQxgJBdJe6D/nxR2bWpljogsKDnMZiSM+iOSeY\nWYzX+TO+DZ1bk7yFqAJCXEPqBW42/aZDQ9M0bPfrD7b8ZYCqUXT/xCFu5ZQa\nOpzh\r\n=2xMz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGUmGq05Wi7hc96BGSrMseadY11AR0s7gx54rgXoOyJ9AiEA6O9rtEb7BA5Mcu+sL+veFjdDY+8kP6daYtygC/7SMEI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.12_1575673553065_0.40554695225671966"},"_hasShrinkwrap":false},"0.13.1-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.13+a633f10"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a633f10258963f4d96a580bcc510efad607b9a30","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.13","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-7RRNukyWE/ERRMkicOhxt5P4mS1nVIJLyXYPheduLYfW3hy9xT6HKv59dXSAZ6OrEq5L65LknSZ9sZ3YNoCgmw==","shasum":"5e4bb47e690c21347de9c60c629ec8cf07a4c5ab","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.13.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6t/3CRA9TVsSAnZWagAAsCIP/1cxTcl9oBYNWABxWVo2\nEoLrfTLGzVtezrLgQqy9Ui8pvxSZQsY9LxalIlaggMGuMgbb33tgOk2RmzGn\nClE9TGPUt5gn/xZCb74sz57DmBxKeOxV+2AljtufW2eihDlfF8pORjpgehGW\n+Rtg/W9wPgL9ziVn1aqVnxXKARpYLVygeGMsrOGKqL1QfBIvk4U1ne6oINhU\nj3rrGE8aluHaYzALNy+jt2DZOzR/cObRKNIOqGQ80R8hL8yKYcgNGo5/zujq\n1VE5rNI7a2D2+YdSVsJQsWezaBBpRLXGBawLvU45PmO61LdC+Gz7hg2euhqZ\nDGpsnw4vpbyG7X/7b+YF18YqYZtWb/P6D/Df1lhPNMViwFZerK8tFe0nBhDR\n7oaNqi1X/H3Tr+wYVvymTFELd5Bj40zQCIMoELQpMjNGykVXhsozzPbyDA8z\nZSA+UPlqGUE5+W1/7MgSXTEr0Vm2oz7H+pf1lYAq3R8w/uRfE7H2YDrrMpsO\n306mLnudBT0jNcYA40eW0lExJhIZdLqVI8RDuEk+/YJyTLTi0sT0xZpuLyEH\ndK3vZ/ZHU80kiGihgR0prJKdfsNCBxIXUN0nKvnw/dcdJ8nRiR/sTxWsh9VS\nd/YmOn82ClAT8aNTlZkhlT2LThV0lh4exg5t80MOXhnTTg9+/5eHhJt82mNM\nwSZy\r\n=Qgr4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFHkRAACAP2d3McwJFtCGypsrsVvmsbr0CNAzn1YoHX5AiEAvwuLwrwQVSP9CH//oZPub/jcaTTc5NZJgN64U9UtDMs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.13_1575673846107_0.3193354603409122"},"_hasShrinkwrap":false},"0.13.1-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.14+c2dd033"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c2dd033b04ba1417474c24a881f2e2213b67d64b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.14","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-m/MiSSd3RMY6yy61WrIWgbFlkmAkOTItpyoMZa8+iiECubh2PtsqKILncibowkrhAohWk4omq4LDYVYSfkTjSw==","shasum":"8215f0b1c4d946df7b0d3b96fc35d5f8d87cd1db","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.14.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6uEJCRA9TVsSAnZWagAA+FEP/Ay2FaP+ptQ6JMeDAH/t\naPVe1VvMvcR/GON6KtueWU1K6eOglvV4Km+VwbzkUky1oo/CGoZoXnO5jyJL\nhpCZ5malTmQULqZVWuoenDSgWdrwJB0KIX4QNV07XFZzCCTue2o6cfEUheIu\nXlA9pIVXkxkPV8UPG7RO39R/GSEJQMo5Nvw2eYrcdGiXyu0Ut8afmScBUJOB\nxULbb0XQHpo7DFdJbc0vaf/Kw01UUG6PrwbKydmpYCU3tf9bOINKgSkeP6U2\nD0jjdn70J8JJdlNly55OSrxodUOLHOYKpuZBGodVSAlpm5MC0H+sxegu11nT\nA4RK6C7uoiba56P1Eocig+nRAlSEp23x2DV960/dAVuGxKDgI3WwGP0rYgOi\not2zw5fYhHcEmqvvBiEovA15xJKohez2eYbZm7sQFOold9Le7lftyxZ5pNRH\nxxoA7wmvUJ5bdAH2EDiHwuLfgAz86bJlZyC7Q+6McJLb1odovxQfcsEQTVWa\nfiWNY4pHZrAcQeQzduyITmWT3UUj2FzCzdJ8Eq2Az+iEY63CIP2lvoVUT8uz\ndgLeZnZ/Uttb3+BReHwEr9xW5d3KYZ5RPEBWwhc49mwKux65ItDzjaPTIFGp\nAcAgzcfPs4Yk9Egg6F+dHvazXIzLqJBwZ+y8X56e32QDzTqQSpy8Dg5lxAOT\nVyUk\r\n=9qIZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEQZADqhGSLk/ScWnIKF/U10duHC5TyuRF7SPCjiC2NUAiEA8ACTz/GlKHqz89GYJd0GCeCTvZsS2mfk+NsOsLAeb0w="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.14_1575674121267_0.2702306086256585"},"_hasShrinkwrap":false},"0.13.1-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.15+b9a0a65"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"b9a0a65894e47172b50ff476709ad068354e402d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.15","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-3dvyS+IvxMw+x3nHdE4iVvBNsx0u5PTFP5b8Xu2ITjK9DUnMs7jZ8bpFJSNwM6rZB064de3jcx558gYBiWexVg==","shasum":"304aa454f20e5542c552e9ba4d00ea9a887ae3f6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.15.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6uIQCRA9TVsSAnZWagAAbFIP/R7A5ww69ohsM4rya4Dp\nb4EzH/xr8RsibcwQTWL+vssLoe3yW6VdKvQYyetqfoEcQ1DiLz0uVZjn4+gX\nlsn2c+OCbSoxhRiwAMImrceguv7u2xeqvJtPA8bKtQmC5MdrmJsENuWuwRIP\nq5ecDThOYUdD1BATjKV9wxc595sQANQGciKwNfZibjZ/x9WB6ENNi+OyQMb5\nF+PzcYlpXtYqVgJ6xUsrgv56T6C9q7b0NGb2rEfIQYGlXTyTINRuASUM1df1\nE3fP34jXgx6d1yB7Yx5PN4xwfR55ZUYlyLbtD9K4Ki7zskokkHT5ODDUno2A\nSQvRb9nZwL94AiQdP5dQC4Ltcvk4SS7CTNkwiZwgzjnK+5aGMtRUYpHskfdZ\ncOz3yqUy0hGNYGJLmBxtMxVfbWwTC0slMJ91Hcq/xpyCG50g50bDBa1+Ch3W\n50LGNF+nJaf8SeIkMa8IbunGBc6TPWbcvyImflSuLgc9IPWjYlYdbWaUztZG\ndcoVha4SCjqJmzCSn1TxvuYQ0DlD8Yy5aD5XNyzbVha9PWMMf2eunVgThA6s\nF0+q1Po8s9/z4lp50ZzZfl0zmL+2xdQMmpiA5vygcE+fZf46dXW9MEEw9At1\n4xUTfaw3az5kKxBJX1M1jAXcZvEccM8bG5zyaY0aZP+TbcndiYmcsDQb5oeg\nvGY5\r\n=eOsz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIC4s47ArhfZrZd3hDNtBQ4T5ybAibgucmH0lauRqI4BtAiEApRWZSFTFhPMSom5bMfGuFLncxNpbSCX1j5uHIWTxQIY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.15_1575674383792_0.7459338964993043"},"_hasShrinkwrap":false},"0.13.1-alpha.16":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.16+f8f3dd8"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f8f3dd815dd7edda44cfc9f639ca7bf948861551","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.16","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-CpXdqutAJPYiy6tzBvL+y4toaFH8FovKW5HL8I8JRYG3ZtbPRr8Ki3INP1vHDycpDEjSpkf6CPQl3qzhH6Aqsw==","shasum":"87e7cd2b5907456852ed4bed610d5307444ee3d6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.16.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6uL1CRA9TVsSAnZWagAAr9AP/1Q/Ryd43cyVlOLYm37p\nsgMI1Y9NnsnrEjCnzioW+AH56sTA0DafaiwA0mt89x+9bkE8J0uIe3hJEXp1\ngcBQ1X8DvRCL6sE0GLYlEFeqMYNjZZB98puuwv8UrpdIoY/FHsis6I9JWHqF\noolvqEX2KvHHHHmq9AHcNQrlRtabfJGBN574GmZFKNfdW6VuU/LPoMQKXCi/\nkZDedTuff33EsIrPKZS4Rhk+nBpD9wd9qAlufBfn1E1ZcV8Uhd60Q4oJ/0uX\nWiVNDs/TXBrVGYi5qXdYmvXeZoLc69Vk25xerkozXoKBtN/Qzweizkm2+ygx\n9d+75y34+AR3TU0vsNpYrnP9nerKHqwMS+BK0eOTSrC+JFfV4hY8qrcCMCyV\n8jZyJmcCjuTz5OCqMZrTvfzDaqIVJ6h/joKu1Z6p8SWnsv1S8DgHLFGExLeM\nzE1nDFEIrw+hG80lvZhu3g5P65xRVu7TzkzEIdiORS61wwPKtnA9LRzPkTMU\nELzGovMSVoFb+8Gqxw0ItwyzB+3h8ba4UVEfCaqNIxU4IxuIIzzETatTrtkX\nzxPjydzJ0rlC76kZ8LsUP9F4CV6nX4b8ckQ4ognvv4DNxYTJwWnSGaDPwCJA\nXQeo0VLFhttYeQyOKhcHxOHwwhr5Ra6mH4O8mJfMQNkGREFaUmHbyK0QbWmD\nmoKe\r\n=CShR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAt42GJOeEQDdBKSXsIDpMmbtm1WO+a7cipaRfmexGKgAiAS+a9e+VTcFDu/VFQ02vKMmOahes9X0+OdWD4p62g9dA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.16_1575674613438_0.9770751335380139"},"_hasShrinkwrap":false},"0.13.1-alpha.17":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.17+0e01e00"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0e01e0079774186c5c0691268fdc274019d710e0","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.17","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-8A5HqlnqoNvkCUMYYVDk9zBHHg7m/gBKfBnRef199aATKpt1J8j3y0zzGljOSQ/ofAx4jnw1tVfpw/nGFtCitA==","shasum":"097a8816e64848ba0d2c87756effd2fbdb87afd1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.17.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6uOxCRA9TVsSAnZWagAAjBMP/R9vOK50nRsSA4ZAw10R\nxkkEbbaQ8xaYuvaciBWIOxyKOXr9T1Sj/pNqQK1Uxi/giNocfHi8agSg+aTw\nHT/1hFkpvWyJYhqdh+764+tDO23KKcG1BMVB4w3OzqHxqitKMF3cEdva0+qo\nS1nP061kX6f38YfM3tvTnDtNwGZLY0shFg2mI0eF3ELLIygxva6kHuI0lMNs\n4RigaCXhF0TWSubc8TxxftGvmzTiSlavzR4UqfqAiWy7p9j8PjslxLi1s8PC\nybMt3DhudWuONa/7FPqxMS27BPhRxqzCH/4Fjn96eraYZmwU5XjhPsyk7UgJ\nn8ReA3qsT6hXz/Fx494920CllS17EwDfSsSm77bsQ2Hqbs/jVe2v4YIxheN0\nabrV4+JlM3g8FoFfzh92kl6e9McbKZDq4F8uBva615TjJ8LDQP8Bh8rN+tDe\n9mB9PuL70OPvEJdRqohM5P38HvnhZMCFEg198M8vQBZoQtYw/O+onYw4zSXC\nZ724zoEXb+tsMXivDmu7Svcf0CaQzEsmumk2hSr9KlrakpZk683Adm3zQ0Us\nspOSKhE5F8d3u2zYajvdA5jvBRWfgzlOlryPfagykx7R+BLEluvZzO0yE2Wk\n4Fij+7JPDt+dxUGOx7EP7q10y0qWCUgkD4HSbTLMLT5B49tZCzpy6VnvLUw5\njyAq\r\n=kUL8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFzS/4RCFIkpiW0B8hXGC27ISnb8CbYSpKuluuDjlXVrAiBVqRTy5VK2RDzFAzmx70EuK9su24b0cM4m5geYxoiB6w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.17_1575674800740_0.8087380983430659"},"_hasShrinkwrap":false},"0.13.1-alpha.18":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.18+3f0aac0"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3f0aac097443a86cf1ebf6b3663d6202a658e291","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.18","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-OQtEeihHgLO8BcYbeZWlafrMknB8F6TnqZPG0U22xKuWSQw/oAn9fDG2zMisEUn2lrNzTuQiLclvkyPDEUJ8cQ==","shasum":"7d7669ceaacd844ad68342b9a7c86a6f594030de","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.18.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6uUQCRA9TVsSAnZWagAAjQsQAJVDp5g86S4Aq0iLfNta\nYXyRo+rdJh59DCnwDnZknuS2NzaCD4h60SwSYqDYJSrglSEiVPlwt/rPol2a\nRmBfv1jzUqbqUxDhWyn3EaKw9dsEi1YEkbfsGFkKKW1CIfdO0rTdj8J2n+Nt\nBoFXY5Rbikju9gmhvvVNqk+s65BqyqkpUqezCJOfzOWlEwlELwLyNc8rcNuj\nexLr9q8vOHn/Ku6F4EnFcf1egL5KhKAlfay600K/q5Ifn6KxPpQJzcslCWjm\n2Y5XwEF1mPL6w4SAjBJNHkGxFEzj5t23xyYY7O6W+BtWhtmJoe41f3aB+87a\n/GvOLOmA8b2Az6PNyYzIn90k+JVMYgHP9+nERh9KNBmc3wckvmVK5RjUaFl+\nOuPJG3KRqH8i+qSsufboIHwKfbEh1KSxePucZpT4rl4WRSdykPSsqvHqRsC5\nLeD1aIymjpvdL0lKOHEDez09AdjPfqQG7ahBqbvwBBhhjInbr9IpljUEpE6L\n33zOFNU8L9qaNfceQQ0M/Z+ziE7FykhSsroZ2VA0WdCEJswZb9rbANqBV/hl\njablwIt0KZASsleCEB5qrCtgbeBhL9tqETOXaOK2ueLMr7LzxP+s8N+spUdF\nuoDHiQQCEm7AlnneT4rmEJwOOXUUZP+eEtGR8ER16je+77G5Rb7wAQehV/W/\nUvCH\r\n=RJYJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEY1UkS9NPFkjgAEutQp7G2ZWpC3ium+jbM2/qj0YT85AiEAp8DyIjsrxRUcj4MjsSYOpQ5yntNTUjgtUMt3rfMKRno="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.18_1575675151757_0.341028972325933"},"_hasShrinkwrap":false},"0.13.1-alpha.19":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.19","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.19+7afb33e"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"7afb33ea27a46d78786e894ecea0820668e039cb","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.19","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-kzy3cUAnXZsuQUfGWsyUUEyagCVm3M8NG54qAZWtmXuVLoay5KIzDFH0+8IYNRYzUHR83NUYAoSlrKBPo4hcqA==","shasum":"2c226fa521bc0d84a5340dd9b9be052464bafab2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.19.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6uXwCRA9TVsSAnZWagAA06sP/Rfamp3PguoUXj9JaxVb\nR434NTZLQ4bClU7crDEEqtdfhuF9B7V7m0cdavrezJF92DPEQ0CxlMdf5CuQ\niHhpFA4eeQbtQYNwkDbvq5QeMEXxKqYPMqJmFfy+rcgsbQ8hF8XCFcV5ZeR7\noBxMMzFD6sN4mc2l6WlcoO9z0l70/Bd+fp/a/HV10kFR96CvqQZhq1tviRVX\nxqRSL81IqVcEjTjqD9d78JHD6huS/Nrg3sFU8b589+vmMvItCuLI4b80hJGU\n4qAAZUF/PDitBjvvKrWWwdM8QwEcRD+pcds2IM1f5+4faVeZW/p/UYlq6dEp\nIax65YIW7uWvpSOikZXB+mo0M4OEPO6QWbleMvjziotoxz/lLE7OZDuzLewc\ngaX2EwKdc2rYHgTxjkFLE3uRKO/g+C7flRZEVHAVGRN+7bMELuo0/hWl/LEX\nOXFmU1XcMwECJZD7Rkaew2AeAxj2I01XBBpNgZqvlngj4UQ0dHyXp49Sry1T\nZA4Bw1nLLmLKIgPMQsc+FOC4UbFYG39Wbw4Cvc1EIScGm3/m5Nw28RU6PuIL\npeb7+PXRWfqAIljn0jNZ0rbFK4oQHizwINKY9yyq7ViicDfNYJmREZ71jphW\nC3A1r2lVTvXa6huZRLPyahygMPNEfYgiZ4qbvXRUulCpq4FZRJqPCyaQdVTT\n8IUv\r\n=nAlm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCYo5dVsciDRa9ztsCZ7FzVBwAvifPLReAw1M0RaYDcQgIhANB5X2NQ1anffYCgck/gDLc87Z4Z9iso3qxgHCnz8hzd"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.19_1575675375670_0.20741624982352902"},"_hasShrinkwrap":false},"0.13.1-alpha.20":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.20","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.20+1cbd325"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1cbd325b9ff7c185453188d65be57cc0620c12e5","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.20","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-uZr1QzNoaKTwfy2GeEm8AYAZd8IRemfEoGLnzWghKgevfz+dpXkkSaEpY9pnwElmjuBrcNzOfIZ3GEXvMsh9PA==","shasum":"714d5d592b7d328a076eb44872203bf1c01a8739","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.20.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6uY5CRA9TVsSAnZWagAAt8cQAI6HeYvj+Nupp+3lpB2M\nBqG/JlJ0Zb+R1FsB7iGnAc6ko/RKjVl5F36wFSoCSMuoUXhXzDZCVNxcSjP3\nBgEWYUhbRWpll0FpFRkMl9RtlpsYGkrmaJoGunAZrKAI2XlD4xGWIU4pjPsW\nCInYFqEMlBnCMEZcvEcSxDGi+LNTf/+oDBvwzBEQpRCwvCCQ9R6zb5dAbfU0\n3YZRVXZyjsCmejWqQUyiovRRgwybYG92baq7RYiLsvH8D2ydhsRk6zJIAtHB\nADO8Vrv6+5Xg5SPyol+3VCOqp4cKGscJBBSkHKTiyMDTTgvqNN1XU6tS/OOV\na2WcYHZoaUJyis3mKytXIRPRjCUJFIjOi3PbTR7RwfYntuK+0SZHNAWKkXgt\nr50duCVfaOnkpTc9CfyraUhYpKaAvjH0GhjEqxXUPfL2IPaHW72XIu+jDt8h\nk998phhuRiw1A607Yaa6L77AY1NpRfQvNXN3mNWkrhWIl4TBU0YS+6j4odkd\nWJLA1Q7pYCk+Tx8bhSobezoD7LO2ZxHId9TRFmJw8Hgxm8YqBDvviLq+oo2Z\nWzPpW2D/xXlNmcvFIPI/gDJ+H+dLVyvBO3IuDOOZLEsbo76OfARih+I/iLMk\n9eKKK59+GcbMZ4c4MYfftqIuiCARF8wp12yQeqTDsrCRHyoId5jB/6299dyB\nUBh1\r\n=iXef\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBdKpe4fSq7U5axiXmtsC2+mjAdYQ8CQ9Hmm15UzR19pAiAkLRNqcHQ/wAJRoOOKpqFL7kUB151kpTv+arBpT7VURw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.20_1575675449044_0.3825868242330164"},"_hasShrinkwrap":false},"0.13.1-alpha.21":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.21","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.21+e7b73cc"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e7b73ccf8a5570bc14f6931b33bf0154a0b5fec2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.21","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-PKJZf+dSg+0d100Wsw5CF3G7el5gZuN4PvLgdB3HPbTdkNxzq/CCRDC0X3ITl11/8w8SwNbExS9uu15dEyfnZw==","shasum":"2d49c9b8d5b420e7a9d988af832a5e5c6423725d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.21.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6ubuCRA9TVsSAnZWagAANZwP/iQdL6Tx+NqBXX5Zxl2y\nHsP00WgMLH+AIBDqd6vAr6ejsAUk9yhoiXAoaWuSpE5w6UGPOj1VDj1l/fIB\nqmdrunkD8rtDEzIFHMItKSMZX37E3c6hOuHuJI7BzF9omYd7+Wq7WKxsjtyz\n7e39vo055gWQYMfTXhdYcGdB7hkAKJdaPQ0O0LJWa1QsYfToU2kIj/At/rCJ\nTxFXE3QaRgbBLvy689xqcFYoi7DGpvLF1t0l8I4OlLaiyCJTiZWK5hQNpMQD\nzkFK/i74lcMihQjsy5EZbS7yd2QbDbBb0Pz954Gld2pNiMAmRF8UveCWIYca\ni+xcbJHeGR74IIs9BexOJhquXsNfjEZ6b950IFYDrMWc1kilVdgH2zscbPPv\nq+ADqa/IpJ5LGpcjtFHHn2mvbMokKzC9n0nvNI19R8rLyWHecV8Hs3jaJM4W\n8q5owg2J4M50Z41eGeG6OMwuSytSHAVO+2uf4KQQ0wgdCutFdAf0Yt1SOvUi\nMQ6DytWCVgztHxgKtZfyLeTMMbq0dVpehgufDo5HSLWDXzPtXaqtzR5+RmZC\nDKsRh6i4zdDq33isW9cShgRkLpjmqheDzuJFjmRCBjIhQNRTCZE+JcCJEpIh\ncLiv0BEo4rftJxdw2odOx5kqY2PrKnNK955xWASUkasbX1Cb94KyamK2JhVe\ny2EZ\r\n=dOdN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBgVc/Qdvw3Kne5coleqyemhZUHAgfRHO92jsw5X+xFGAiALYIeQLYq1WtE0nwSNAnWza8IDQrCJYc632VXToA18NA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.21_1575675630520_0.19311955881815823"},"_hasShrinkwrap":false},"0.13.1-alpha.22":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.22","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.22+c8a4524"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c8a4524865a0f21c3eb027c1ab9807d8655111cd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.22","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-UybDlqchtq9x2uZDxLQMZeza0Z76diGEULGQ/b3+nmdeweP0map70OnbChJwVbtRRICXOR380GO3CvzecpXUWQ==","shasum":"d37b1be29b20540a81b0318751847bcc3a27706b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.22.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6upuCRA9TVsSAnZWagAAaIYP/R1tx8k8hrvPFG7Z+5rs\n6k/FULkBrNaJGTGxvwEM6yZhNXXEYLXkC8UAPq+5gDLjuWP6t9emnBP8YIsj\niZ+qT902tT2tim6jE4AchIdPQJLNPIQtLMlv/tssRpRlIHZaHEWaxQpXze7p\nm+Xc7A5yB8R8HbaPEDSz52Bh+FGOTFpmsJhNFh4WV9Wz927D/CIo6IR8dhta\n6/IMVvxhoy9NPqNZLjK0O4/P2q2rlmJoc4Hln3jUCk6pntNycknmVfr9JGJo\nKUS5X6X1NIuAhgtpaVMoUktEuDp9h700x3y063tLqWl2wSFy67RyPXXFYjKv\nDWcy2Ro4aWcv414zEdwtV4eTAUE+BiuM5pybTRa+GctPbTRCBO1Ns2kyQKX1\npdsCl6iFhm0nn59FPMqou4h614QolfaHxRFGWJCqZlQUNT8gu4XTi7Kuu2/S\nGlPTRaZg9gawlRLvOMY543B8Pdh1cJlZRaKEpBWwWQOm/jq3ziMYOz35q4BW\nrJ4TeKoVQ8YFNuknAt3koSXLkqyRtZ9khYCfq1Iy+oQMyAqwyRPaVBU33n5M\nTN44azsy3f+lN5k53iJi1UbcdFLpmaFIAz6pVpxmtqVrnRecyjRh2nbrZUj/\ny7KWEcp6cVm3sphgp5mYdMr4S5jxriLqqHt733hq9Q3Y6XV6a1wfR1F6Ymar\nakEp\r\n=tefY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCSFgiguHZK0RL84LapuVdKcEWXvPw/u7bvxcN/y8c87AIhAIdYuSTvo2sEcnko4QbG5AJu8nwsm8ebuAwealgPgpEa"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.22_1575676525967_0.23011473334276578"},"_hasShrinkwrap":false},"0.13.1-alpha.23":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.23","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.23+1dedffa"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1dedffa5b5c72ea7a39490a698d9eb05ebc1702f","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.23","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-Lli1S4Ri4F4TmxQyaEp0kDDspS6m+OgRQ5FNi3zCMEAePPaEQmQxZ6t+RLkHv0JqPXS4qOyNvUrbDqyJuJV/fA==","shasum":"34706d375b23fa63784abbd7836eb86ee232b836","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.23.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6uuvCRA9TVsSAnZWagAACdsP/icWj71HY0qGH5RkwBf1\n6eZpJJqyejZ1J3y3cNelGFpYBHCIAECn22X1LkMxyiobq1gncTd+HUQrsc7q\nTM+OP6971nxsRw7kEa+X/NGh3yIcVuqfL8CRNua/tQ5rVQXJLQhGy/BxaD5B\nqCL+aKPEZqPmLiAy95dMIeQg7dP6plW1mTeEnM1NnW/WVQ8VYRLOQwVCDtWN\nMUK5S/CZoL37XSV0uEcA6KNQArv8dhxGZfpUENYzw0gxS5C6DsJjn4Ezj/jv\nbifTpf8aHr99shkVJUDLc3HqhzHEr4xrw+HYiw4GDDgNUwKb0eOqeDjUQ2ui\ni7XJ5rxgXPaUgSOZkdIa4G9y6NufAvH8TwrhVAXfHlrD54iQ/F2+KUkiIm0o\n6PN4IMp3DCq4tym754G1L0rkjMsmc25wpZa6lzfltlw9E0Y2Aqs42EEDjVxr\nxECbxOxKvcowBiOMpof7jfE2smoUgQNOPpLl3RWyZ4R7fGFEEdFG2+MzW90h\nmuJgXNwyLv1pK525ldBu2g8gw/GcDTLn+79GTTJyF7Fa41rIorlU9RlsC7sI\nrlgg2HoJQ0WZBed9LO7fJvCwhBs51lNuG1dYm3ncX2YPqdhpEvDBBFahgJvy\n+M7RZVK724YXcNp0aiXGXyrvYCe7Sg1NkyQtbf6Tw6kqWbH6e5MFUJNhiINy\nHRRM\r\n=EaD7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGtfOPCfWWVNcjI6GGkwjaFqpttnW9CW9L/AD1UUCEPmAiEAgm69pD/6G8876t5e+JpGVe94Pg5Y96HBAHULgYB1blM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.23_1575676847034_0.6287165120646938"},"_hasShrinkwrap":false},"0.13.1-alpha.24":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.24","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.24+ea6ed39"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ea6ed39cc27d6b43c533c1665cb107603be70828","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.24","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-SmL0f9M6oSSiJajngiukTkLlieedrI2bt9cszZPeIdlVBd1Mg6pqcyG9cqv9W6xgSu2xLgr4xsMyHGUGah0dmw==","shasum":"367c9c0d8e51db288b5d756a8fed75d21ae6430a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.24.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6uzECRA9TVsSAnZWagAAeSMP/3+b09X/UrCsCxiPxmJx\neWOzJwtqkaa+7o3az7X9h7/2VqGakpMVtR862HuSsgUSQhnfvahI9e3l1Un0\nZjY5IvlBtPKx1+CjAOhcXtSU9E/71ynFwsw21ytIkSrBvzInXMbczxJ+sVEx\ngDNXR2QT9y6OjNPOjZrh71q1j6HWJfyAgCuabPO6NHnbtoHr8Zg/SIP2WHVI\nEEF0PX/roY/WzHn6uAL0oOiIFi8yXXjH39ZXBp29ZGeNEmYsoyabBEA6O9y0\nJPjadORmy1GlZ+U3FdLkvH0qlfGtj83KJ3kezQxithiECK3XCxxO/LSyN3+j\npq56F2Q3uYeZ+gdeqCWXwrRjDN3wFn0UAXWPv1wM5wllxFqKYt3iZIokSM8c\nmI3ni+Gslv9ykIDQuqBfWikMUn+VZ3i2vwuq87NcbSQfxnd0ocpyWDuc6A62\nNuaXBn3ksJ0GCD3cZv6eavfNbmfXTWloKnJzb2S/dKMXa6thVMDfe3XHGAN1\n7OCpNjAUuILTx/8NLwNieex4umjqAS3lwU2082MGWWpoUeBurKkdncHR3tI2\nKhIhpP8LD0QFoVDggzSXuBBgmVzzRvI9tq0iOV5ihFt9ClUwN9Llg3pMgGp6\nPsApBI8F7EN/Q7WBTCBkRhfYKSs15axp9OIpNX6I6toTdlpoW4fzKTFRvTFr\n5Y5l\r\n=1N0f\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDMNIkwpfE6QUlV5ut5NeoEnGXgCrGi6inCq2mxWNhM2AiEA34admcGAaC3JtICyP6AuUkZbbzezwo4Tr3p/dd3c0Yg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.24_1575677123540_0.3339202003356565"},"_hasShrinkwrap":false},"0.13.1-alpha.25":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.25","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.25+71b4166"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"71b4166c1ea9ad5132212b54576e2ae8abf9d63a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.25","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-zSdKgDAQp/9tyLkTK7FT1B92QLLM9VEcdTlEQdJhuU3PyQGGZ4VWQQuILa1glqZkETiIbkpgICpuEknGkkSwMA==","shasum":"4c5dcd134bb55d1f500a16837f3d2bd6cabfc6f1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.25.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6u3kCRA9TVsSAnZWagAAsVAP/1CoB0UJ3PoUv+tF7ujS\nyV547zEq+4q1iClXD0Lllixnuv4wvLSSZ13w4h6Lc8rONUImAMLhw/5kCjSi\n4jxTIIVg4i0D3gpwYPeywUwXzgGtV+4AZi1XiUmtu4OOxBEUPlBXX9bNrL4b\n9n0+10Yz5PV2KRqnEfT2Wx1Xahd1MLMGCqsTCthJCu7iCo1sNy89mxKamBEO\nqavxzkFr5EFu3fe/+7S4nwgSPmBSecpocAb3hLuL9q6U4yly93DN7Su2QrXH\nJxtiexEVLhC0AGcq9z40xOXYZrh0Vp0PvaSyD4vM49X/ebqrojh8gXyCH2bO\nNCDMb2CARYXi333Y0ZgJM7ZR3CW9mWzDP0n4ulh+1j6kcrW/bI3iWKvGrqRM\n975G+VPUy+sPcaCfUM1LvDvZE3NZPldZa52KyAZpBKyGwP3jvSczlzfaNKMq\n0A7bXuvYZl7qmOi0NUM0080wZcxWPkglhn3I/u3XYu2A+aoFxwS9XqLY4MnH\n0RlnTX0KpXuywFTQ+Pdpdv+dt7VmKhLWgIdsSkL4sNtqoO4byfb/P/RqVxv3\npzwhxCNzkdvs84svPU9vqjMJVy5D673YgTk0fzRGincFWyWYs6TIrjwnygHN\nZGdjdH36wLlxe32pJC2ieM+KrZYfxsAao8MMv/caYstuMXHyf+bxutqhU0E0\ni147\r\n=/NLv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBRRE6otmGU7i08V11nuhXEYAdr1m3eI1B2r+nrsPhuyAiAYQbrJOcT10/qm/KTwVtHF5HmlPFF/9jC27VPeSxJz3A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.25_1575677411728_0.8797451774690308"},"_hasShrinkwrap":false},"0.13.1-alpha.27":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.27","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.27+f5a1ba0"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f5a1ba0d9d1b16f41983e289b2c0b9797a75e7cd","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.27","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-6fyj2yXY2JBjfSdKEDPrcThFlQAenGnq6ONtFl9zIDtYBpSdnIg93LrDLk3ILXr+wZE/ljUilm1jyPn46/QuXA==","shasum":"af244f4dd837c8c19d8cfb2c307130d80a72c994","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.27.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vAnCRA9TVsSAnZWagAAp/wP/jKszcF9EnmEFwQJrRrX\n2yQXWS9VVRMEjwJKeT31K0nGj8mXmOhnoq1KIwWWsgMUE21066MTG8nPYWws\nGxCr0tVJ9V17qbfEqOoCpKln1oWZJNogT+6JuivboGeMJfTHHGlnn3Qtlp+N\nkDaRaul8jz7iq297S7SRek/1qgj4j+r0ebpJxPx0EWL3uUGpOrJigtf4Tu8C\nOoaXlaSzVlAgg4wo0AY7yZvry/roRiKimBMUrgPyZGvYeIkJQrjZ3eYl2XpD\npeUoZsi8zq61CMQ8/D+L6WJakqE+xp47Ycy/EqHiujRcqyhNLunHhQI0NI1P\nxL45JzTbPhsVgF2942HnQCfi/9epe1dKtfdarN/wkIdsVSrdk/gcnswTFuP1\nvXtPqvYmsaypDxEMV3Y/w5QRJqTMWM8kVx1PXT84P2oQRGJAJji0qAuZX0ZQ\n5p0r8f7s7dLDq+2TDVc55NUnsQ5daFhs0+476ip2ArLzbI9IWaKd0J06ejYE\nfirs4RXulEIcruIsW1kGjNOqQsleL3cF3r4yvEjF+EQI9uOJPuAKHWisOPvZ\nTRUpGhkDG62q0o14KbobHMZLZL8RX6QYy9M18qdyDfIYA9kczT5HRi1DJ1jJ\nugJXY04B0fmF+OyLeaZWLasyfuxobhXt+YMOq7J4pfFuZPhJXGnEWV0Htcig\n5L7l\r\n=5RoW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHWh3kGHmB4dy934je9V1j1YZPSMxyQPuWPHdR5KWHDSAiEAgk9YBVvZUnoIVNIWu5eq5gmcWdauw0WZV6mqfxdQuCg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.27_1575677990816_0.44509338622624206"},"_hasShrinkwrap":false},"0.13.1-alpha.28":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.28","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.28+6a284a5"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6a284a51927406fd99d77a2058dcf5654d015316","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.28","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-7V8ni44WX9Us4Eo8YQwFEyLGmc08LQRJfkPK8MwSb6F2e7cJB7A1NXVRhJqcbMGVVEWI4uSwpx1/9fge0JnPqg==","shasum":"e09fd13240cc9339925255f137e5abf596711767","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.28.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vGFCRA9TVsSAnZWagAAqCQP/0r5od91TdLEVyLpgkRR\n7TITX0SwpiZyUP0scM8QMsnDruPcZsOEiCqg/V1FrI9pdMdzCF5z7oGTlMJX\noilpLGEsn3txmCsxidW+dtUK32rejcTWVVXFkZDbQM8DG71HuNIi1inBrTCH\nA9CDmVFnA9pgWg42MRjdKlXuH7flH3Zq84B99qeFCroDIzktJvWkaex5vSf4\n3/qp+EN1DL3nq49QA1gAVmTMmSIh8yDFk+NZQzQ3bfUALvMMd0LEZ6Kc2Nch\njirowJuY/hdPzI4NgxIxrMhoYQ7wbuwvDXZ+hDz/3xVjasTsfAjcwE2NmDDd\nmWWl/kta8HVBrRMWoVEpCQDDXr2EWTvKkRZqm+xrGQf5ZVM6WQcnryqzD+DN\nEycmJRE7p9Wi1NnJZJunCn/0r+++O3kwzEswOqDTgogmdZjav6EE/P7Dj7i1\n0yUZDnh+KIAuKBK4rz4f2nzKtjUyDIdo9o9QsBy2FM/EZONwoHd5RxarQQ/2\nb6D/pGetltnCoRdAdl3CljFctxVVKj0wf/F48tP1CjiyPkDqkV1oLNVYC/Fz\n9QzX2J5PZTXPIsfIGkORmJx79EXlQh8W+rf9Z4yzz8WChvNxgyzeawZU12yb\n9jDVyYx5LomrnkgF/OmbZNj/K8iF3ZE/3D/xR533PaszAWFVuJucN+JF1+ai\nTp8q\r\n=rhjA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEVWTdAEa/z8dEOPfsfum5CHuQ15hzR6ZKvpjl3ME+8pAiEApiloADhlmFJlxWkTyGOvuj0rVd/zhk/HaMdLu2MMPvg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.28_1575678341339_0.20858249178269417"},"_hasShrinkwrap":false},"0.13.1-alpha.29":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.29","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.29+ab44a6c"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ab44a6cdbc6991ec58b008a66705a7ed9e3a93cc","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.29","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-AJWBWH5pGktqWUZZOzkuvdB+xRe3J4JC52RDxKL+L5U22sBEsO6WaSFYW+m+z3/H8kHtwKz2PO/sovxe7DP1GQ==","shasum":"33c60e4a8d75de6edd1269276822771a21b40ad6","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.29.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vJbCRA9TVsSAnZWagAAtVIP/14Ii5Qr4GaewATioUdd\nmSsmHdOgUb4tcUQI8jSh4ka0f2FqOCfYKEtRNRcMULfIz47Q44dOssFtJLCQ\n+/barZBl5WQk+PAoM1SH9n8YMMxhaZQ0JuZz+Hl9J8UXmkmoRRAtnslYnsYp\n0eOY3q9dZOF/5ZaEDkrVK8fJ7GjhNNq7RgJPFgvRVYweTSN2oCbdK8kw74G6\nOGUlGWmnJlSp+VegAFPrlr0wTD5MOukH6S3HNA46JtZHsFobA6CyEEGTahOW\nr8nwzb3xTDoIoFRrugbA86fiBmNojABSyw4rmNIKqYwrOuiQUmEISHbqluy7\nc2Qw90wbmu1cniNJktT43OXa4HETjiIOMMDoh65OgEx0EL39QVCLNYjyYHYT\nMVAjjIm1OJ1BodUjMRnqY2IFHEGR/H9Dc/6AW8Lqnd8YCDwRnPrtIjRjDIkK\nNF+GPBnAX+JqJ+mFygAkXlqHN8N/SCrCQ6NGlF7AWsIlDnf911625tuRjAju\nre7qiLmE4HX4Gizc3wuTfmo3Q+Q2zc55OWQrEqY16ZRQKDdJ8/2ya0obMbEH\n3IEWDYZ6GfqifAdxtOg1i3TPX9vh3q/+2ZzUM3WLsSONKuKlQXcE2euI45Wx\nnl9HCUUJTcfs6LLg3Tw0GMLMUt5wTjbhiJxcplX8cB5PyXBFCfn1SzhJCtiP\nFT53\r\n=RRzf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB5BclcrzZzg4Y3Daoeoug3Zn54y8XQubkeLIvahfdgvAiEAlLdR1PmuOKmrRjLpOLpOqXGRroVUs0RHULPiQZv41j4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.29_1575678554640_0.884721943322073"},"_hasShrinkwrap":false},"0.13.1-alpha.30":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.30","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.30+ccb988e"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"ccb988e5478062e4cf830655fa39b7eaaaa93553","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.30","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-vanzC9pumQXCr4NAjTAjLCuomLD7bfA6KMaG3we1/9WLOCtn88MufccDKkwESHOWsc6kHGcB467Cta4fIi/S/A==","shasum":"99fa60ac4e352fdaefab5326243daf97ed9a0b73","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.30.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vNnCRA9TVsSAnZWagAAk4wP+wd1JwZFCqy8RvqJQwwD\nyD+2QhzEFP2/vASd6k2Vg+6pyeAMBB9H280CnMzAtwmM+oXZvhutqCzjw/Wv\niS8Gb47wKnm6DPFZxiyFUynITPlpOhdlKPEL8J4ok/QXlKn/JzNSvBCwA/GV\n9bGwc426WChlvzTxGp40JJKB66gRG5sKdAVVJxpREa1SOpfM7Bbpmn72N3H6\n8bIJYt70HuBdZ2uHoeUkvJjuPT+79HBDUk6w19ejMfHImN89bTzdZyjCaxGz\nVDSjI97UHEbXA+Cr38/fE2mvn3tPJDGfEvnt88NsDbmswPfAlyxgt3mDF91Y\nd5JaU+paTlgw/+AtRrbi/u3atj/aytbr2SFSJjr5xCQYVyPMFX34plSz8iez\nE8XmitHF9Ur6dD6ZZHIReTgHHDgD+pSzQ9kfyiAQHfCZdOZS+FGBsjv+8378\nWRIVXakq72iERwge+wN9eo1nguU9HhO+yLJMg7B0O2pBx32N0BKbp/5ktKIL\nosgkABaQvOxUomTW0f4ywyWgPA+u1TVKf9s9IB4kP6KxOZ+qfWnUk6itJAaq\nBpYcs43/h8DpakSdobyUP14pK43AQ6CNN3XSqmEK9uULwQwgN790fY5OyWu3\nauGjxDugI3ihHIUsTJBmyoY8or6quAjlPyItV51nVEL4YNyi8Aw80LbJUhdS\nQcsy\r\n=JysQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDPnn6PaMW75rP1Y2TpX7duDgUe5gvXpIP0qcm+BHhN/AIhAJsLWbxi6exckbX4qcTKtE2dc78whAHmiaHzPhLf3me5"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.30_1575678823204_0.04195133315971167"},"_hasShrinkwrap":false},"0.13.1-alpha.31":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.31","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.31+6f6197a"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6f6197af8b68c0b0e8210866b3d76bd31724ea9e","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.31","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-c6yLaSEqQL+uvoJ+EHek63w3csFLsNlORhhL8EvI78+Er2jdsnN/xkhRZStJbf4NKS/jeH+ZECi5Iw53Sr8tZA==","shasum":"222776507eeaa8f7af2703aeb924900495ca95d1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.31.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vSjCRA9TVsSAnZWagAALq0QAKJb4vCD0AiboX/HIxxw\nmfAxsNlkg+ZdP3kgr7I2loKQKNT8/qdKYtiHt/K7VWPy7UpEMJ9aHwsw8iPn\n2Yw9roFUvCdPUJoH77viaUSrAHv+2VbWDAnaT3M5D6fOcLBP0FqhdGc8IHZK\nTdo6s8chF/ZVfTYX3O+fBw1tBKYg0ABQLAzA8JTRxgDUItG2opxUh7aXcmlm\n5eoioCk1feM+XGnfP4guvpPf2mazMDgkE6/Y3tbcXvxos1lQwr6SYogQSz6x\nRQkIfZx7N8pszZZ3g54CAsAJxg/PWNGbuleOcZlYPfXolBS+Yk3V7qw5aX2p\nAzSs7kTlFMKkwa/TBQds2+qVpPVynATFVuHQ/j97tmcZ9+6qKrhqblJ8j2Kf\nrlbqKogIqXR0MdUQ1cDLES7r9ahbx6uIWLemv2wU1yrR3gzFQfMm4X+sWoh4\nWo3+ZlXv1Io5CPYexzSOc195iZH1PmJN3ZcsDf8CuYx1FTDRikR9+GVGTCUU\nPVj9Kb13xE+8Zi6iaeHjT1etPyo5Jh4ieWL573gCWjbIqRbk+OxBECedEikT\ni4xCwVyMwgoHQbzc8OLPAu+NxqfCSBHtHhdmUHMADHh7/t2y7BtDcl/XJckO\n8DJpATuMIV/V8liEYY+0YiAo6V5KQ9OAXTDhib9YALcRmKfQivjf0QG3e8Ph\nDXRv\r\n=rK52\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAOIraIIlVECFgRWBkrHc+3EkSYGmD0n2ioW3npQoyr+AiEA/PKMHZsO0nOlTXPqyVI8HpJ9YB7YEH8FxgVdkE6uvTg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.31_1575679138495_0.1050223951020186"},"_hasShrinkwrap":false},"0.13.1-alpha.32":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.32","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.32+add9d7a"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"add9d7af494a613135366f60ea3a733a859536bf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.32","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-sKRFqlCg9R0kB35hYXdu4BcAHk+1jJAENG93omub4hbzqlGnq+fsxts2rMh8DpuUi6fqj98pHCA5+3hDPxBlCg==","shasum":"89895dd175e48afc58679b7f9c0e114e2c21a84f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.32.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vWrCRA9TVsSAnZWagAASU8P/1J3tfskInGiSBv/VlXV\n1Guc8+n+/dhsFvtDIx/pw5uOSj7PuxGIUXYfWdeGIRg75EYuwiiVkYV5jvoL\n5GGyS99vsMSDTeA6eNQClDbjVxCsEoNk9gclzmYk1oUCmyj+aszVFuJYC74y\nTLgpr6LEQmJp4xzJvfJDJLmWmuVwyqLEvHhbONuJqaD9RvO9LlkIT/KnY0x9\nf2LsNb0evH1WSDDecWOVaGWJZA8odWrcqDEirAVhe6A0WJ/BMYBhSNL/6w3p\nptrxRkyOppAuTunxLEiWxbrgvfGtIcAagrFY11r2GUizzjh0MG82A+kZaJWA\nIPMB7d05BW5+MXpPEl5F5Q1K9EZ1/WTouNVtKuKs66jq4wZRZjjCt7FT17kf\nb4rALTdq6oOUlJt1UrBy76AQPVRbybthCmXD1U+Rzhv048Ku4ubDPyZW+TwJ\nxhqYagtFLfcmTdyJs5hGfBc7KCun69MtWkLb/ITpgVUzmnBc0XC3PWOmG+XB\nCbMpd7VFpcHA8ZUge8ONvcNeHoUIH8dr1JzZg3pV7TS8X7znWdhLXCiAnNSi\nd/6GERgSI+6dF7kK1yPBThkVwWuEwmnU84rLzj5PNlA1ZK/ICOzis+IcycsX\ndrk6VTRTV7stjF6C/02V1nzabm0zxdNZMZWoNX4wKPYHgHqv8UajbGL/OFwL\nhN3q\r\n=NLl6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEE+unHe8NNtDtrHhrshsRM27XsQnvE6fabLuaSYz/xVAiEAiGMiyCMEIS9w/hNPHJU31WCev7R9hgbg52ROALvzaOE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.32_1575679402986_0.2566572486489651"},"_hasShrinkwrap":false},"0.13.1-alpha.33":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.33","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.33+29ad812"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"29ad81282165594a0b072ba3024271ac3834afbf","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.33","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-1C3WQm2rKTuHZp2dF2WWBlM51cE7HP+nYjl5Pxer/pXYRc/vxr4uruF183a1aYy/Ze2VcLVHmccPFPaXQv7L9g==","shasum":"2799e95854671ecc26b0c9aec8cc74e0c8cd6956","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.33.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vZPCRA9TVsSAnZWagAAqnAP/j0DzIDmHW/C2v+chttE\nvcCybO10iPH4ty/4jLu+vNqs2fjuLcm1Z71hGzon1Tc67FdElCNbIDCjlJwO\nN0S2YbVjVOS/6hJko63ogz7WPQGmu7mEXjzpqWqjB5jpk2IdSN63cOSLiB6J\n4PFSD5VhNdQrhoucaIxlXs1E6FYms1JCi0/n4FPrxj4Bvxk9AJOgnDDG/a2v\n7yEKnvybb8ITzMTTOCyVyGGWubX4CNaiXskH9+/YXwUtLxQEEF1vOGBHBeSx\nG6fwPjYsWQGbRjguJSXUZaDcWZyJcgw5WYe5zgjfoYbBUm/C3jmZx7TOaqfv\nVRd3ZnwxwTJVwtgA63ZKzu5dzdTfvtRkrsDtiBXdeR1DJJFLH9HCWlBBwNhU\nCGDgEx9KgknFhAqHBW+A19eVt+Q6YEtA+NJyA5Dtz/5eut9uvT/ug1gzGPqI\nJ3VGAB0KqrrdlobstwO5aOct9wqLg5U+EZJ4MpsdhuL7DLewlA9Zwwy0W12A\nc+jwlWfFlGhCM+J8D0+j3uABqPFPO5VXBuStpyoSsXE76PSOiDAi7w2B97PP\nDxUXljimi9szNA/u+8lBGhrdlVDRrYgWj6Af0ISuX7qYQkeD9Rf/sqiLjqHB\nR9TdoboHSFJyeHkFGo+ikPE4GQTzY0VZje+eJPsqVN9BeRWpX9DRgkUrZKC6\nMJJC\r\n=XtD6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCwPY1lbNoVA1fUozHy1SrlYqPjwky4cHA5Ds3Xie6PRgIhAIrh4YwyNe3ZuUCm044uO2QsEIgpbCHkdmt9/u0nqpAp"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.33_1575679567310_0.411656160733175"},"_hasShrinkwrap":false},"0.13.1-alpha.34":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.34","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.34+0736bff"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"0736bff1f444ec16a81f96a6b70c00bcebe25db2","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.34","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-5AI8I+JHpuiyJUOnv5mi0FkasiG9+Res9Kx7CbbJvLjblS0nDBrnSNxF/4qOVl2vzbgknpXlDli+TyAQfDeC5g==","shasum":"6f04634cc324491cfd9905a956eba8f3df918431","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.34.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vd0CRA9TVsSAnZWagAAyuAQAJYm+WQ/HVXdjOHVSK1N\n67bUw2Pv5vDEvEZ2cP2nzQnCrXguJHTdul2Df8ystLPiunhfXlIzFIyoEwnC\n72VJ5sn9nud7zwAddFUPfPE6zadAErSwpF66J8bTVMq3S4+kIwpPa+PaTw7Q\no8PLY0G0wHAqmFY/C4Yo1qWX1z6YM8PUolEhvQw2zFukX2vbyniEPmMroGPK\neE8Gz48Wogyor8gZDf4/MywTqyVwK/FtOKqSxU2oEprRM2sb5XP8ZrjKupAf\nUB47737zxU+O6PoSm8Xdd6/xb3oSZfWovAlAimJzw90GgHXnznqumhkVyXcb\nOlEOlxuaojrw5TvS+3DMkrXeAbuCqE+QSnDYV6E5UCm44XADaP6ABq2+9jWa\nuuOrh2Q38JV1+9iiQaWrwUXBibdHrXBXIUxxJEgaW4byPG/s9TlfaFj0iPL0\ntDV4qWEXm/iG0N8M0fF8QoSjO74uA1E8FdiACo32quAkQFrGIM6IEB+jO5Gm\nAmFTu93BC5ZYcUzI4zAhe34NR4yoEQLTMjWlJkGGNZb/k+Sor2to2jau1VJY\nuy3zxA2JfsxIe7qN5XU/AWSdLUFIJNay/fkWJi7DDNOcRrAxe53IIIJvWibO\nRYjlHx491h8U1/jny0c1JivlSTaI0U0EL9e1hJYsTH+dY0B2EuQYTH7ZBG3J\nr8iL\r\n=yObi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDbWB8JrygYVjpnwv9S4Mx/sK+Yvcsk95eOFxnjBPVm3wIgWIia01AnftqTjN/9qaWiblVQQnHKXCUiwLzNQCc9gJQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.34_1575679859800_0.9262817170854554"},"_hasShrinkwrap":false},"0.13.1-alpha.35":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.35","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.35+3f5ac8b"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"3f5ac8b52ca625948e9a6317c5e1beec007d7c68","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.35","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-nAY1Is9F9fxgLokPrS2WQvG7lDxouDeHR/BLiKfORlwsNm3J7YF7qc/E6d2dWl49y3kwgkVUa8sHuMTzHqqFDw==","shasum":"1d25c84589b0f14254fd8f80db5ae744507e9094","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.35.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vepCRA9TVsSAnZWagAA5MIP/iJD0uKfQUUA4NBVqoFD\nlD5tpP7EMrgINqwwNCnxZd5R7iHUhqeoNXPbSfjSBN8dHuGpU+n/2VZjx5XO\nAa/SAtqR/0UfEbgIn/TNNfCwBW3e/kdhfk4mrbH6xsCU33ah7nM3ZaerU+Nd\nQ7lEFEZfi+7RO3nCnAz5UsGQcPKJCVKsTmIc+k/Vn5A+yJGuEs72OPGxCEdK\nC4R5+0UcC4PBFdQHeRNxPZAlSm3l0VR5Ese8legZfuQ5zrLU3qmuxgVDhBOp\nMJrZwuDJ26LKUClw6mu4SZ3CUYNQnqsiuqQ9jMZezCI3G2Tf9oNq+5ZHYZy7\nq/OuBo6PN07A4annvWLD1p0d1ZG1mMwdzuXDKAGyQa92VTQsrSqnATPqr+9L\nOTZhGiS5AmRUHxpu5aAV1GuLyGpe8vf3elhPlMOe+iE2S6300gqq6UvQBbiW\nQDh4qtg8noSPMnBMK/WSgpRm2FTUKKCcfAOYf17U7InWPaAmkc/Xp4FYjg6N\nSbdrRKZ9ZD7p5+EnQ1ZhVeKvQtTUT1BtFqLN7uqnidvf+D4idlgpbGspNTQ2\niJodvP0URLquHZzovGnR32pHI/mjC76h/zOLsl1PL4cvu94TG42EBTW5IafD\n+Ww/oICd8iRWsEBjx0lydbxJmlx7rhGEwLorlNd7RTu/YYTu2aCUGuMyeD1k\nLevq\r\n=KPiK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCk9swnxUZQTesjlE2DdR9Etrz5q6jM7dw4ZSqtvo3LVQIhAJNrQimY89zGiMyAJvz3uRrAlU62Y+doCDbEle9mWa+G"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.35_1575679912554_0.9220948639080697"},"_hasShrinkwrap":false},"0.13.1-alpha.36":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.36","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.36+f97a5ba"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f97a5ba982324d6732409d4868e559e70ad88753","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.36","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-/6M6UhsLI27n1OwgmzHepgXN1FcTZHfLLU4Cu+C9CtpylJEnBf5e0ntJApOvYcVlMa+cWmVSp0TkcvEnavhrwQ==","shasum":"9ec7d2e48aee9df018050cd51fd3ddda3397e754","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.36.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vikCRA9TVsSAnZWagAAba0P/2eQKhwuEUxm0G4cEX2Y\nlppBZl065MfUykp5MW8oa2jIzit2CNFHf//pcY0pTdVFe4yaAda+Z7Pq25Jt\nYdWLC6gSSgz9arS1wcHt1R3pZ30em3vo7tpRTl5M1nHBfsg4RnCDPU7sUT5V\nK8SGxkUhHQl8s25NomdbGuWoKVh2vhgqUDpmlSaQRPVdQ6OC5TNNrK9ce4y4\nuCe6YdWvz7k6k/UUzPZBat0CUqjh1ldligo7dYOBlP1FoB/rAF1/X46O/W7s\nEJae8GMxhZOS1GGKLKS0DEmBr288RREIkQ2l3OTudP2RrYPvxmQCWniX75sU\nLiahY9if24pxcWltcDFK2tC93gCwbm4RAVjoR65OFSGbH30hFYNM7sClTSpn\n37v5lfwsqZJHuxqwfwr7YeyCt9Lv0K8EAW54uOVDrc6hH09EEjBemEOrV/zb\n4hHGRaOvp3uI9hWywhBhz4nyObTbzWPj/lya1gfQcswkiGQzH5pEGPrEd7/r\nvauftDyFer0gD2515BKWqJELtMMOus4Eh6/aojYdwnPs9LqHv3jFSFd/qcXs\nng9C0BW47Vu1H84Gc1y5/K4husDdSRfYmjccaJ3CF3Dhs27JesYjtUpF0BX6\nw1BtDLZgVAd+bk8rdFDoiVijajleoroaXmQJ+27TRIqjSoZoKdBBqr/Y4x60\n1Zdd\r\n=yKMD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCzVEjuY+nA7pIs1iWHRJSJiSonF1+0DXoKZt7r51+BOgIgWhXfgvXTEGJE1y45AWUIpLwKmziRYAUMXG9w4mnP3UU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.36_1575680164181_0.4940208088097806"},"_hasShrinkwrap":false},"0.13.1-alpha.37":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.37","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.37+735a458"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"735a45853b93ebcacb5c813ef7f47e7a1de0379d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.37","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-TBScyLatFxCHZb8zYZ98hzsi7PyfvRGcdtPKqPRSI9yN8qD5HetnH2pC7Ai7IOI0bTjw1z7KXZYWYXGVuzV2RQ==","shasum":"47e2ed1c321ba96da42959df1c6983983d92d12f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.37.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vpNCRA9TVsSAnZWagAAFFkP/idoyYmc8XEQt4r5TE4y\nb+R1nRk0uOegJqX/Jkjc+QaKyJEI17E5g+B4SHo5IRFNzN3bL1FneI4kGmz9\nul3m28NORabI52ZHGMlswQLk0GV6ovSyh48UwdZGTOIkZX+wYHUbPlTyj9+k\nFIhIRFXEAZm9by2Cz5V4uAZ+SdKOEYLJyVaenkbw/ZMeHebXDX+FlmhS/vWP\njTxW9S2xpzxMCE1R6n7n1iKHN/3d5UGq04/11DkTg/PvyfptBmTGCEhKRJj0\nMutiVrYvK+1ZNUn430e7rYnAA2LHEEf1m+dqwm25PjQFVIR1H7/CSE+PBIKJ\nmTR42ActmJEdlKX08x/PQXJFPMx5Dm/Sv/354MZhyf0nBrK7xGM2QeEY5utT\ndWGAE0XRpl+HqrBaBVFxBA/S/VW3sqVNMzV0YEzLdvkFAdR3Pac60twnKhVg\n9w371eERhDp0FGdkYrrjLKqQ9NUT5VqlHq4JgPeqkATfmATUHEFgsqY3hsju\nIuqGU3RVAzhoNuumOrfOahVEYAZuNTTS655q3wI5nsvdj+nAScXIGx2DzEFU\n9tg3X85rJ02Sil0BqxgI1KKViQ2OYD1VFTn5708VIVqIkkV1B+jcYiATYLPM\nXNmDA9t8MeIOv4Knxmy4pGetSqFBoTSYZguhNf0V+wp3RbK+IUB52ly3Bi5z\nTWFH\r\n=L7cp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHjvYtY4wnfq6KMa20nbEOCV5fWxgvPkBJTYYUvEpZWRAiA6ZYDRkrt4wBmkHkKMzgoNmsf494AOoUSAmv5nBZNqeQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.37_1575680588671_0.8381276036299758"},"_hasShrinkwrap":false},"0.13.1-alpha.38":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.38","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.38+9a94fb6"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9a94fb606d445f432944c76ab05a2f46f0fe79ca","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.38","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-Mf7th2f5U9AbjT4db2E7wodcQg2VeCmrJcbqLJj1Bn9+WKJ5UcmDRUgOUYzgvYIPkzJl7CAqhmjw37fhyKPp2Q==","shasum":"63da6fab79406a70712c160b8f52d31167748476","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.38.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vqbCRA9TVsSAnZWagAAnSsP/3AbFgwxrAKF/WCiQ5qY\nuBTahIAEF+2gqtdL5Rpz7o/Yqam1Q7ln/uNaWniAcPQDmKTxxBslZY5ik+Ax\nLcWK5pLp2Cy1jWHozojXMjS/i66o5I2Anzi2Y44neY3Q4M7cEx6NEQ0ELYVK\nx3jx+V+I/LUF5bOXSeBRbA7Fn4z1nvRYCgrZZLj93crc8moEdsqt6wX0o78A\nt92flvaFwMyK4dHjFy9WD1rb92JWE6VQkVEDe9qngqGnSxKH/SOvMQok/fQ7\nsTglrhAl/BNhQvXevrzAb8/lnc4qY7KUygvPlZvat45C+7R9wWV7NWKhl94s\nwMCmaMb4F4LiDuXLLgA1DwIudYznp2c/sLvv3Tqo2myyfezFdY5ZmID6PgJu\n5imH/ldlo77jSZmLUpuhO0IlVMZfDB8QTPA1eZ86kOV9ah6ptZK44sKBekar\nDEvViSPR9/CNZyS9aN9t5tTGQmY0jqoUyRf61QLSFgFy+vfYDoIJkUv0gOBY\n6JPh1eiLDfJBc7dTV/rDjGiWfDTPTrin7N7Tn9aRd0p891f+PfXt5/GAiYLx\nguazEv1kycfk9uODt55iOAEFc7Mso3hRz0SJj/wNbt/LavJLKuIRmOJBy8hi\nw3F17PJtlYFpv6PiIHtfnLPvGwjOuXU9kyz2qsRVAo3aoIvg/djVOqqunUao\n3BLZ\r\n=0o49\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBAWfInEgdyJX4tnJXcnavDt+oKmHlsHgOb+QUvYXAe+AiBRPYwlXg/MdmSz0fGmtrQ4phCRqIYl9VaZJ1lk3wK+ow=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.38_1575680667001_0.8796043095503052"},"_hasShrinkwrap":false},"0.13.1-alpha.39":{"name":"@react-ssr/nestjs-express","version":"0.13.1-alpha.39","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.13.1-alpha.39+82babee"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"82babee842a002dc597efde14c5ac7a3da7c3f13","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.13.1-alpha.39","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-DIvOyHGxsANaw+8JRSnZKYF2e/8XL4/RPNYbLZItXqXWBBYD1ZT5gt6fffQdnXid7Q8KxELrs0Xxs9q1Kh6Q1w==","shasum":"18315b4ad7c70e60df9000870b6caea75585b432","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.13.1-alpha.39.tgz","fileCount":8,"unpackedSize":15488,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6vvDCRA9TVsSAnZWagAAhZAQAIw+RRVYJQdqUjCf+heb\n36dOzGbbcZwOi46HlK/qxNv1WLfY7E45cLBXy8oCrdAbw3Vvh5p85ObT/F0f\nlp1UxjyrfxjKXUMOw1LR8T5hCMhQvn9L3/Wm2gNo9rETcrRYfa1GjZ5dQxJP\nzg0z0slzekL1Sw4mUOKUfFZXRQ/A3X0Sw0PHJ8c1yKNpCum06cvvF1ghBxBn\nS5fDQ7z2ha7QML8INNsXz0e0fvIjZLaTS9hCeSpggTg8OK/KiYdvtzBHtHk+\nCxoNMmeREQ2wa3ASlD0LEk6djyFrmE2GrZ2KIXBYVCO7LctroQPlTfZBOFf2\nnBsDtmfialYYbdKbMCIPHIgUuQMuWcWodu0JvkRQLUwm/u/xzbysQLhxu8Wn\nyz7EHrepJsUWMhmFRwkdWkVFSip3qK8bPm7ir/Ybd/bSiN/YMiHPX4fraFDN\nQm8PXZkAKG3KQT7sL8d9vFv1KSEXvH19MynEEEtYv8mC9+YVUs+v/+Q9HrwA\np4hwOtbnK2LjBvDOOq9Nv+krucTf5b1xcwbkKri4A3B0h2j685rsIyBjSqkA\nbfBc0Yon8wuz6bN/lKkPDq43wT+YcJim3F9w8IvdnBJ/yovSFNZJeD+YBkPL\n8gkb75Ivfh5QnNeicQTxj9XOPShzOqmJBeOcNorMA6d/CcMr0KAMovb3gPrO\n3jVr\r\n=ZE8x\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID+lLbvj7STAhNQ+dpekWHucNHIdbHkRQOlMnpAp/ANSAiBDoOuXZvMPhd7bhp9MrKGPjZIOzlT8m0Whe1Im6K/okg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.13.1-alpha.39_1575680962808_0.9141062649882077"},"_hasShrinkwrap":false},"0.14.0":{"name":"@react-ssr/nestjs-express","version":"0.14.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.14.0"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"6db9e90b6aa984fda996bfed54fd5432a60f7b80","_id":"@react-ssr/nestjs-express@0.14.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-0mGmWRPuf4Ku95YNCJnfYD26Nxo7So+5XSV71AYsWGpyoOEFUdhcx0q0zeDV1h0YozWLCbn6R9vRj38raszQtQ==","shasum":"e025d93ca04dc0945009329c4ff3eb31bce4180a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.14.0.tgz","fileCount":8,"unpackedSize":16279,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd6wF2CRA9TVsSAnZWagAARTUP/1tTLNsbhiwMdWpIruA/\nyC1QNjk9EFhWyBg12EWrnctggUzy8//PDG2QgvJmOP18eJBDkWLUs1n6vtrG\nsPMU/xpUldnYVQAo1Osoh9LGwGMz1rMBmNqqEKSJtwEgf8zB1tukiqAcA3HV\npl7sO/Xtlxo97A/PsdIQtPUD3GVVXxD6wwvIaZ5v3v9PxLDGDYWlglqpfdpe\ngY+OuWcKBMISTIL16wFoHNgpWwV3PC4B4UqOsy8q5iHal1Az9MwQqX3is3Q/\nRYjC9k2xSHYC1kBrs1f3loe9uBoC/Qn/ARJSN2PjBGEHQN9Fvl0qJVQem9kw\n/ZeD8hNCESVHsTrHMJR20ACER4vPAkdGdAJ2M0M69K69SLTBOxn+d6pl5CJJ\nio64jv3xMWiEWKnITmIuMCTq/WB3bBTJ7s9rmUhzE4hFXfqsOsJAyQxsm2l+\nwIJuDgH56hs91laiuD4undrdQqJcJ/UHbH6zt01v8+dB29lnMKWsl5wKWty8\n7Q668bZiFzm9FkJl3kt0cjbSq92v9iIQd3HhgO893V66OKc4S0YHLItMxagH\n9CogImS87ve98SyZOU+uLV7lUvqaS/mqGweRtW9SwuEz1BxLkk2Ne0zfezvw\norL+ZZwOaOvrY6laDhp7K9KUA/9edAx/luvbPPP3bTRn6hcaiIgAi2S3HJdj\nyRu7\r\n=zXz1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBpG6tv3Rqw8QimKL6ZPKmLhafZABaxJeRBRc3eTpI19AiEAlo3DzM4FvOxxE2ohynagXHFEGvjzkLIgWZT/fK6rdv0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.14.0_1575682422302_0.018204660932093608"},"_hasShrinkwrap":false},"0.14.1-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.14.1-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.14.1-alpha.4+8bb1f054"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8bb1f05452413a7034c2485b34a484d143ec7cce","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.14.1-alpha.4","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-ZWIwXIXstBpmuOEPltXR6a7ZlWBu/ENtnjHzIUmxope5uwx69AU2ZBENzS1qRlkq2HOKyLgzsBR578DSpwNS2A==","shasum":"c88cdb19e005a604e5bfd1e1e04a8b5e22197dcc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.14.1-alpha.4.tgz","fileCount":8,"unpackedSize":16313,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7cA5CRA9TVsSAnZWagAAUKkP/2+6wfJ/HKz628N7seiF\ndoDO9At8yvokFG6YeUjFHwH0uQGV8+/ws3lR3U7KWjzZibEJEmNiHB+OsOnB\nQmOq+g/Q+qMcUpjF5pp2kCr4FOvf3l1VrozsyZsiLJzv+tsXqOeOm1AnOKNr\ncxqs6/4rH3NQogzsYYj6LO+RiDADq9XbO8polvvWl5blG+6jBo9LML24efdN\nussL0L/MBvEgCUGjUkSapPVCz931NWTGhc5sbi19+ExL9fISozD3PM8pys0X\n2WnejjLsowlKwflQtpLbNeAE+lPFlI0K7xSvsP82FjYmHRHHNDVhKYOYyaHh\naoufXiMumK4SzMcw/JKT9IW0mN7IT4oOIOMHiPqcEYsMAJeF5YVQaoYHZzuf\nD5MLZC46tVeHJNL9X0GV3D5UmFNmDB1MzB1LzI8G0PkKXvyEfLJlMohI0yrJ\nm7fdy+bnn4PxRJwcYTIQTTaPAUA57yrpyfF1z68al2u0gvtc+gDFy6ULOGUs\n8NeW+kNc4Mv+MFzs5dWIXbVvHW0ipPN9rxxTe8l5byrByjArP5xhJOhGJl+5\nx6OSHngeLa7Ytq/Loryk0wQTWzNRVfLs1OQo69/QYOylgSm3m9s6JOKlYudI\n3iAhF+78zk1WonAS7Sip7e1m2l12Et3W63B8wUzZT9zR9RcjT9n8aionvxom\nSBI5\r\n=rkoi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHL5BwIf+IQQ76BA5xBqSezrXrTpOXwUkQuv7XbWbHcrAiEA3yI5PFZRsNopqYnlUCszhsAuDOhhR04CMthv6D83kv0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.14.1-alpha.4_1575862329271_0.18351628620568228"},"_hasShrinkwrap":false},"0.14.1-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.14.1-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.14.1-alpha.5+27688dca"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"27688dcac3077bca3f77e5683a90feaf7bda3463","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.14.1-alpha.5","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-w97tTNo0a8cowrwN9QFL47/fMF+CIt86jTDSvyDOHjHPkoikBxkIKFPaFsClzbuc3vj3x2O6eLGj3t+jMbVS7A==","shasum":"c318b910e731da9fda082c10b3361131086c9282","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.14.1-alpha.5.tgz","fileCount":8,"unpackedSize":16313,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7cH1CRA9TVsSAnZWagAAffkP/3zKQIDyrfZw4HFA4fMa\nhEejjGYQsRnWG2iFco5Kw4CbfZ2myxvSC3nOoh3DuPvl8hDRQK7QxU73DtkV\nnhlDOjKeHBxVy9Nf2R7qp4ehF7G0BxJbKxDOSfaBOes1RzO/JyQmgI7aOfRO\n58Q5CChvU8q1DWrCNWBhd2G7w5Umyt0riBJFDSNjHcfVUNP5hUYdieFcdxWn\n8DcKhHRi9XP7eGpyl2JVy8b8mmiI207fxEZ69vKkCtXbH0X375u4SnWRj3on\nNf2CU4JEcm9ROSn+7VBzjVuwXiN9Sb0yLYMj1o/smbEU5UaVvfvqhCRgx01L\nyeEbzh7RPTTWwMaWc+eTo4VMNVPa6DmrbKLfm3FqbZhy6de0TbrQlUunk9BV\n41TCsbwWONgQIDax5i444fdJtuztCCKr0wO/XiwNVoJ6b20bLtNNHd3Flb/+\nDYpaIIRoIKw/g6twbEGAgOSQeaERNFrWuCSpzw+D+zVupLhLF+q94mZ+IeDo\nJNTIMPAQFzzLISdeiAX9HHU96aWOjQZpU7jNIeGQOL5aX2QepdnlqBn3e1b1\noe0ARgFYw6H4Bk9lj1FCaMfMiRT0GBR4hJrJ1bgWvo2cPhEimDH9YLybd2X9\nHQVlVdsoicRReKmQZeGNoJO+XSh2MUqBiYXj5slPEJo2QdQ/qURKHmTlc0/4\nOm8p\r\n=HrAV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDd5TwGWTRprll8C759nGoFI9hxeExA8Ny0IjiundwW8QIgHgtF1h3VIYRIrMvTuHC0CijP/96BUZ5Q/buxA7tWlCw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.14.1-alpha.5_1575862773414_0.888947425711361"},"_hasShrinkwrap":false},"0.14.1-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.14.1-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.14.1-alpha.6+a5640dbe"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a5640dbe95a694186fb8a71ea752dd30bf28e976","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.14.1-alpha.6","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-YtE4Nh4LKVWNOSGjulEv7+9h6H/QCYhug9aMtyLFdLn87kkWN32xlSdVJ+NAXhckMAPxQPILmu5gR7WWqnukAg==","shasum":"77a8320c380664b1e7711a1ff0143d0c46a8bf29","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.14.1-alpha.6.tgz","fileCount":8,"unpackedSize":16313,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7cLoCRA9TVsSAnZWagAApvsP/jmj6MXFNmD6OmMhoI8k\nYQ1r7THz87SarUZodw82aEArZk+X7k1zyc+ng12kw3Ebb4dQvlqJQS+kWIRl\nLCLzMirn6z854gtzvXrUKa3xI6aSxj8RKIi2VtklTH7ZpN6UnZjrtVKx9sJY\nizX/Ti0vcP8oQEui44GV/xWhjSgUMHL1dkiD+Tzm/jgM9Q2K+sfeL4FRH4Nv\nUszAXSY/oCuQxrqWNXhHQ5ytFb0u5UFhc3wFM9ogr1U3X46tGZPe2O2mngqT\nMyOV4CTitJYXaV1TcaED5K6AOKvAZhoYekrsb2FwpLczK9F960fOmizdZgO8\nbL+DfI2WkqjAaIdYqMmMrRKPwKQoTE0eW3LGNeMVBlaQd7jbhENWzszY8TyJ\nLsaEDbPJuFhC/s834xvo+eZ4PvT9mO6OzfSd5X/ty0p5BePsSMzv7kP41UO0\ni6xj1rpESZEoBGgXWJTsioltFoGpCc5v/Epq0pfU54ySzHLmyJfRIKIzcUON\nhIwj3qjQf7Ev+eSjcMrquYt8eLN+mcMWURxKEFFbv7+DFnhLaiIQSdCgVzQz\n+5srEnvjKPYNxffm4ilmIifuDDrMc065T61PIRpDrL2CaflrrIxlO46/zt/m\nuqDIqvhkCc6azQvr6UkevoYRUQw6kj0gG6Kv2w+0bdIG+jjJVlxBwiBlOWR9\nThrv\r\n=qlbJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCwYRTre3r3vUiV5VBsaxCJqZrhqCi2mXSWqXsUqNSFBwIgJGq7Jk6UOxh7hpiHmaXB8JVhqDMcLMWmdB3WYt8o2/A="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.14.1-alpha.6_1575863016273_0.9179218440302226"},"_hasShrinkwrap":false},"0.14.1-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.14.1-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.14.1-alpha.7+75267e24"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"75267e24453b29f574bedb66705c00a160046ef1","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.14.1-alpha.7","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-LpaPGg2QZID9nFRepO4WSC5J6AbttbpWkzBsajmdTzKRPM4Bu6aQtqZG6LQRIKrbBn2xMzkVaUOfaLIFDSQEUw==","shasum":"1e0fd65c302cae27370f387ac685d9f4cb8c0934","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.14.1-alpha.7.tgz","fileCount":8,"unpackedSize":16313,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7cQ8CRA9TVsSAnZWagAAfU4P/R+uQmHwYAwWk6QtTV5j\neujbci2EXHCBjiCwlg79i8ydz4UhW9XRQqE5VQG6oLsDomPXKRXX5VbGbSHV\nIAb0yLumJdpMIwgPF9yF5ULfFnH2JXKDCGE0WWFOFSNTVe2l6QvNOsidRbDq\nt0LBqscUF3Na2tb3qgtc1lw7WHZQx0Z9z8bL2bfXGAZ/Xr/quHBJ5m5MdpgN\nEu0DAdMHNfXGu+eDf49a/rI9Zr8DpkJiyTftG7LVQfNXqxWsoKiI9mhWZB8o\nAVtrOmvZ47bNWQu5WzxQHFBpOrHatinKE/1eXmt19MbM2EL3UAib7jasqfsC\nVHSr5x92xH8ee7lDQc1FoWCWO39xU6saZsJzbIIj1ONWrpRnOJ7SKiCYLf/A\nNREKCoYoy1JHKU6hGWxk4zpYddftmQX0f1KiG0mCuJhqYX1afUWluBYv1AgZ\nn52GtOsEi4CFD2rcgA0RkT1LcFZFKd7YZxR9y5oS71Z68t50iN5TobMh+cPV\nHWbslrTfjPq8fuqvkBWIxPzjM/akrkPxuCPcsWR08QI4bgulAk7NleuMjeat\nfiMvjw3F2FBGlFDuzKgNV/WIgoH1z97JS1bs8VX5Z2eDpDkszQcFnwZrcxKp\nTGa/RJiiQArmECRDt/hssvH/qoWXSJFk4YS/uxCsXACNxQQM2HtirJ32e36r\nWqcL\r\n=2hI3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC/UXwh4/G3RGKphNBcynPhHAl2MuPVgN2pQaOyl9U96wIgRRYswRPBgTusRv1LcGtRFTT3k1PcFNQ90CDV4WAMSmM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.14.1-alpha.7_1575863355710_0.576382020793897"},"_hasShrinkwrap":false},"0.14.1-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.14.1-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.14.1-alpha.8+a8eebb44"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a8eebb44286de5450f639b4aedcdc38441192680","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"isolatedModules\": true,\n    \"resolveJsonModule\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  dynamicViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#dynamicViews`\n\nIf specified, `react-ssr` won't generate html cache when production.\n\nThis is suitable for search-engine-optimized dynamic routes like blogging:\n\n```js\nmodule.exports = {\n  dynamicViews: [\n    // this means `views/posts.jsx` is a dynamic view\n    'posts',\n  ],\n};\n```\n\nA working example is here: [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.14.1-alpha.8","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-LhsTqAz26qQBl3lOtKmNbSsnvz7kBl3lSacRWlJhEOf7RBUogdOVuU1DFDTbECE3GgT34utSGPvBoK6JZYRBUw==","shasum":"952eaab1ba5b12522ff93a7a887d659bbfd8085e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.14.1-alpha.8.tgz","fileCount":8,"unpackedSize":16313,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7cXDCRA9TVsSAnZWagAA4WEP/1GcoHTUNtP5zuRRmdiY\nW34vnkhO//2vBN+UvCtzPamEaZ0Zq4jPS8+UJpPYAXc/KApfxInrZWfALXoW\nI3HCJP+NrcP0bCYH99xQmoLJMiT2UdLeSXMFYCtyCnJKvoGTzPpc6MNlmrWg\nNdaN7OQYLe+L4mPOyTzKEcJVXB58e/nw2K7jd5YDdAZFhTTE39d67yLuemzF\n5IOcfVMroNhRn3Obytf/BZtaR9NDTFlj+7xP9LAU9BsLKw3yynv480Ba82pb\nLlXEHNqkDh6vAnE1YX3gGY6l7heP27bSTxrCLDSKhAj6Gk6V3A66zwBShZX8\n13LfEj/UBv2WRz/uLtSOYeogGlgEboE9SH3rMWWKmjOutIaDihjG/2jX07cW\nThmp3/r+GJgYUmjrOqf71Wl9rENGuGhjKMC+QhCa3GUV0Di8CmdQdkImDxjq\nYTpRDQp8Q2HsWMRdx4X9c55Jn42UckJxQBQ9OWlVUk2/6xZaaiy4xU1ydBBi\nyb0YbC0EFHgYdzhn81ith+mGop2W3q2NggNVnHssijOak7lPuU3ClVMhptzv\nbv7MzmW7htET2aWjSCLaO545FtbrPgGkdm+XEMX4VODJhpgPHHoxwzWX1k5F\n6fur7IRVwIBGtw4aQFXl4XdYo81L2sHNGM2yyssLRmSed6bTy5oYzEuaV/bu\nLOKV\r\n=Fw9Z\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDAoWL3FtjaEhAZ7hTBC/1P4WSUhq+dZXbhXEnq8eAekAiEAvCUVv4glMuQ9opny/CH9in/Nyo60oFRhgNyUg6QvKos="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.14.1-alpha.8_1575863745329_0.594475892509112"},"_hasShrinkwrap":false},"0.15.0":{"name":"@react-ssr/nestjs-express","version":"0.15.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.0"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4a7c33e60247c55915f2b90b2b2e777309e58c44","_id":"@react-ssr/nestjs-express@0.15.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-zZQYV54Gk84P+nXjtWyUThssUfDAX5IMFU4cu4j0YrBHjTjGcRHO9i3TMeFww/HCW40FrxMYwN71bgYrl8NDYA==","shasum":"60ef8a1342488ca4adde324af917097f679fdebd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.0.tgz","fileCount":8,"unpackedSize":16047,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7ciGCRA9TVsSAnZWagAA5woQAIPV61NSEkji+qzHu5iW\neOcGGy7jnxm92sDHTRn+kiMzgco1Tm2jP1BhoKGaRRfEeuswaeIkIWPHNVwY\nX86LgPaP5T0pIUyZYbqNhg9clbc/1SZCc2PL9fc210Spz8MjGr6sxMZL/qJz\nwbcxJQ4bmz0W+xfHSOeGEi6+4ZPyrzs/E6lMXtNgr1/Gv0dA00tP2cCn08pO\nhnd6rQa0JvSoYqta3YqRVAt0IPdtBB5O5wbpeOhnlXJjWPtRfDFxOaNJQFao\nPUlrzGQrHjbJMtJZTgD3s5LvN7En63in1n6GopcldVW5etlDeTUuyICo8EnW\nXF3TIdjfvR9op/4GolCAjPQK7fCKwi8W32tGHdy49LHhM8FueFIJK3uual7w\njEQf1EN/07YJwyx0+53uugS2BTdNufxwn1IoNsW+86rfwjYZqHVbQnFmHJmV\n8jKsyUuiKJYV3BvjBdZ/6+0OEOA44ftM2nixV/6bg73uno4ILAivQez2RZQ6\ndbTyURReLya41BAud4oU9HXcq8UO/PleBHYqQCV+pPaXNRTglsS96Ac2w3Pm\naXscK4ndmtkpqsgY2rKePiYKnybRgUQhUPDYO3eSynKfkfGTibnxjRrrBowI\nwLYzvTqtX8pmnJ1hpRpxKGq2iCqQMkQMc91fBoaI1ZGD9Dw2leHp/0iMD1Bo\n5Aic\r\n=hgN1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBv2VP8hI0lGvMh+Kxgtc5DczrpbowoGcIGGpS+waXLSAiByRjBZlFCy3p86Pn45fyaaz70dxfupmahZd0ywDxcm+A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.0_1575864454042_0.16167779274297822"},"_hasShrinkwrap":false},"0.15.1-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.15.1-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.1-alpha.2+a2a3aa18"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a2a3aa1844332dd9ea170fc5b30e1dad8178a788","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.1-alpha.2","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-+huPMFrilUfLaxMpryqV2jlmuTxoTmKabmM40PN2p8zMerZABG8o7lBewfayvD4dgnmH4mEP7UxiqsNqvSotDw==","shasum":"a8092de0745250d7fd249bf189d2c116ba4c70d3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.1-alpha.2.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7tNjCRA9TVsSAnZWagAAvBQP/3DKULUa76c857YHb2ZT\n/T+TIIxvPL6NESDpn4h0CBk1DX3UmH1hGFTcl1bTpm6pYDGKi4jF5MFlsYTG\ngMBoy6H6Cjm+Od1HAivG5PsVoGyqozprLqSSl+tFBEGn4GvrCxCmOX7Mi+9n\n+qRwZtumIjYze0/YPaDsKk+FeMtLvrnHuQPnQeEIBXTTE9VVyN2EdHsutoE4\naMo3m66uAN3xbuWi9NcN52HJKnstOq6kYpshPBAPrZMfLP5PehY+pAvbCYry\nAZNnFjLAYwgxXUj4Z0bhwSdGTZdOTduXzzc60262JtoZujfke/giwdP0hDy2\nD1MsB/DEp4NddXRuMoefD9ZTfGM0dl8Zl9WM7z48esbJCCFoQeJLof5luL4R\ng/3D2z1d8DDO9EIs0Vyb02B23pDF04lf9LkjBGzwzxRpKKYxONLKWeeyxSXY\nVRs9s7qe0VgywTm0V6sIpRQ2WqxMUfCbTv1NZlBi0s7KR7yhZXl6Ay1jUalz\nNP1HM2PHowG0Vv83Ich3TsS9bupyvhxZFfH04fNiTFdlKQPEUldkoE3XUfgP\nhG/jFi08nw78MsXFlNek3hzlmBuEQS6/3stW5MOB351tgyEyQZVgyhF/L348\nxlJuBrUoGUuR2bvUxYsn2EntTyWCCn4gG6t19mqM+t0IBBFwle4vfJZLKIH9\nBrG8\r\n=MFt8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC8S4WuXSbixbsysS4zosUoLlxYuKlkRAagV/j0YmvY/wIgZcdr+QQl8kijfUe7brlb060/3bp3kqlWX8/8bvB4BSY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.1-alpha.2_1575932771482_0.8557794604534041"},"_hasShrinkwrap":false},"0.15.1-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.15.1-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.1-alpha.3+1d20361e"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"1d20361e8e0b15b2b5628f7b64ff92e91c6cf4e7","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.1-alpha.3","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-wAX7ERj32kWYsptpCLKbkK7Ve5DFCiR4DqOmdbyrvpGq/3WtYjxpPT0e8x6u5X10gE8l/z5PKKtl6GWwgzAM9Q==","shasum":"014dd4e738258aaa91a8dea20f8ce5f9b8044ce1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.1-alpha.3.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7tYICRA9TVsSAnZWagAAzEIQAJnMc/CPAexSyys3MNQ+\n5CFcdsv11gJX1GfMXD3yt1W1LUhaMRZAiJdNDVGXFsym+MwLw2lMvj9L9Imu\nsqtwUnzd69U6y8IckNGuZLjt9p4kO9bPk0HGblVliUWxbJ4EChjV8/ucV4Sg\nG/n7lcUY/hni4ANQOoz/UmyleRXSeav7M3QoK1vHP0MNEtGX9Yje4qhYrIh6\n2HuiCPer7xIUoKf6jLzER3FsULuN7Ah2Eqx0izpPZfbt+Tz+5+f0ENJ/Mcan\nxFPe4vnyXYQ5sW7kX6ZG+IUUnn1io8VRvH8WWp1ka+/9YLsGmzXFc66mCC+0\nh6ZGOO+rL5wvkojRrE107U+c5M3CgHCcVGp774LJbQWQ+v89xdu5VJsbayIp\nuPEKmCUrFZv+CSvgBY4fvkYhjkd++/j1k5ssFfc+/meUkkYAofWn8zlvbnJF\ntZHS+/X4+RDLvZUSrdbXVX7klDtYjiEEvgJx2HK1k4zbtxEFtevHkfv1mEBI\nvPeXBAq6AesCvPZn50xAHu3k059sD6Vk54zofJ/QRkhIzBKMyR8sRASXmpz+\nNmxNIff0/Tdz+njUg7zG2RXKW4v0ZyCBBKwXlpGMSlNJ+wdAj1qGah8fZDjp\nYa1cAyF/iOoGB+ctO/lV34nr3f1SKuaiJ5aTPUC0GnV32kNmNd8Z2vV6qvPb\n7wwg\r\n=S3fB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDuhv3n2ONKibFaRJ6Qv5L2zNcOWzQdze/BSkAuk2tREgIhAJ8QNy8+Ud2b9ZpHrd1TZ36dLBHgXs4I33vVFysXlnsd"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.1-alpha.3_1575933447911_0.9395871746465061"},"_hasShrinkwrap":false},"0.15.1-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.15.1-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.1-alpha.4+f053782a"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"f053782a9c42470060d74eb4bc092b168ef75eef","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.1-alpha.4","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-n/AoJdtxfe6tFOw3NEXwa2oXZ+HTu5RYdtm35v+gblRausaxL/18XJFMkOkGH3r96/rar0xFizNnkFSrlPrsIg==","shasum":"f9fb4ad1a668b267f75413b8e8abbcf9367935d5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.1-alpha.4.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7tb/CRA9TVsSAnZWagAArpsP/RY/kLSGiM/L5L/r1JZF\nVsMRhjKyQJGlmkp0IAFMSRJ+AO+otSWKnSUakh5UHtFU9+IHMrzRnCDHy+qZ\nnRGdltFVYENH2Tdx7y3ghqnh1d88TXDrabCJis8szK9Mjjpw8SLwx4RXmNVi\nhWhURmFSVVlC4BBjV3ukB3PAYM/oud6pzR0fci0oh0IppFPb1mmEoaeWPBjK\n6VbcjZroLQ0wxBN2KDGGO3rvvGwiUwVOg/mYqsalhMOh1FGIuBZGlIM0Prsd\nGRSsH6FnjoQDU65KV0KMyVkeBu997ARTrMNbkHfuA0kd0INaGy/T/kpZtzxg\nB3ywBWcHv1+EGTiKs3xgqYLcZfWr9X+RF2FTA+fZCnn/PZhmLcEZMIbx/6eP\ns8AlgQc1ov7q4fnmvAJhLmyGU3TDsLjQRDaAAECFV2UynKkIxJSidGtLJcf1\nhAT5QJTD7koHTsn4Rl7aiBU/s4uktfzfFne+zjOyD5VETsT5a/e2SYij8fwR\njLNXv5OTiVSOkG2+DG9qR++Rx9/eeUCYRjAPx8Kf+6iTVixqNrJFn8saNkRT\nfraQyqYgQPW5CM956NkA2JCWpHSoHHDziOi06I7eRuSs0CDVJJElbdipyAYo\nlxbnUXaEDlxDzcDosqRg+qDt4g8S5aR5mwpDaDhVZoBdTG5WSbvyhryEqziy\nujBT\r\n=lw8q\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE+XvQoBnrhOWkGNleEQ3oOQFxqAYR3qEOLG84h6Rvj8AiA/tWzznaEg3+DEkntvUDdWlD99xQK3mirqZXByGqoT7w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.1-alpha.4_1575933695288_0.8804177134604128"},"_hasShrinkwrap":false},"0.15.1-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.15.1-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.1-alpha.5+4a6d3e2e"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4a6d3e2e14cdb7145c8cc76c206db0872450e2d4","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.1-alpha.5","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-GPWJc1tgaXF98NvLaTlCF1BS607eS9LAih9Oo3f8/9ZyeeXFPzoXxuZo26w6eGs2XaO5Co2KPeMG3kcdfHuHbg==","shasum":"cbe1c792a0832d04ad4f0db2c73f88e93017270c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.1-alpha.5.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7terCRA9TVsSAnZWagAAyckP/jpfe82BOxINbnuNtVC7\nrn5EKP7d6l1+kQm/qEbaiW1rIo+LeVKeCEpQi+Jb4BqLCfWJGFJZga88yH0e\n0Q2l4c6ZYRj2MSL00dOAeTzhThKIZh3hT/2KthkXf9d/l0U5bKRNUuyPUDC/\nqk6qPstdhu/8dsNECO5Ddx6eGOAm2Wpg+yWg0XGizighO2oea/7XCS8D+AjI\nWl4+WtR0w3Oq07xAFivT7wvj/iZ4VSsHeeABnMwLIj2MYMDZfvuq739beVKC\nJWznOeruHvkzjodvccyPdnCJYWZckAwem3hzA4uiBiu5td6KlodT2Aays3VM\nevdqKt2TF+Kw7mKb1UNFR187wPLUS5cJ6v5jOt0AS2VcSuTspgXP2ltQyer3\nyu1osg32IJoVIRpGnjM1fOXPSErik4K0zlGuOdz6nOV3agQStUxCro1mqMll\nr9bP2STQ1JQEI6CB40rQ4h9M9r+uo9Sl22YC8SK09BBMwUTPec/k+L2cq2Fe\nyAJppdZqtHo+z0JjUVm/NMDAP9M45SbRriUFw2eyI6Mwwd1ypxcVTREhhYRP\nx4eZ9fQxrOanTJxgQ7YJercb+hxYPKW2YTdBYzhmdKDJu36AcW5g/hNHzUBn\nPaPsB1P33x+Zv1+HV8AEFVfU99Dj13FoX5YIiDODsZUMVnFmGyMHdVbCvW8K\nTHW/\r\n=ef7X\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID7vUvmCIUx/8tr09sJ9P5jrtyvY96ntoqpe05c7LnFmAiEA6wdwW4fVbQemR8U+RLjliSDFQKxZv3tWtyGMTU1xQvk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.1-alpha.5_1575933866876_0.05289904718813365"},"_hasShrinkwrap":false},"0.15.1-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.15.1-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.1-alpha.6+33fd0f8d"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"33fd0f8d1f04a7c61c05680455191021da3fc88b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.1-alpha.6","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-8GNeox297xJ9Q/ylUV45sI46EKwgf80iqdr1l9AoZCGY/i+ayR6tJa1xj2WUycnNqqYnFZA2EYyj0Ar2yEQKgg==","shasum":"d15e3458f03d87fefbc77c713467f6a85a978a8a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.1-alpha.6.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7thyCRA9TVsSAnZWagAAa2sQAJczOuysFWGe+vb2rpYB\nhJtv1bWW7E6qc+MF4pq69aWzwy+8B83PZ1hfRsChGOjN1ESRInaWh7g4bEqr\nDxROi8uT/gaAx2vE8c+HnZWozFDnJbMuh9o9fU7LMYIztlZM0hKrqKqsfVMS\nhiPfxOqkzbpAEDQZrkazAlozbkZs0YUEjo56E0cAZ+VZYwQN2qnpS3Uxzgv9\n92mLJpTyPsvJtCzZqogf5eUpjHbR7tkUO05y8VL07C1Pj7/QdDeqdVCAk1sX\nH0uBOb/4dq8EqwPQMcSuh23MQwIYDNJfstQhkVqNymz5EUX5iRCaHSET/5o3\nUykKsScUfxn9VZpxLezlSfdDTNAGvpbUIxzVn5JE6++i8Qaz/ptrlwwfaMTW\n/wm3DHNeYZWyad0S2IELtpMJg50J/DoGFwMKivwzFhGrtRxsN9VBig4apQ8d\nUYJ0r8iC9R6wHsx1QUbcDsRPROmZH6ez84GA6BazvCakVNaiVZMAQ315BTTb\nMGZgzsVS2rM9/jROQBbgWPBF7uRJWiGJXdBRth2Aa+o5Zovh31BnGqTU0iKM\nV1lexTTVQmZBk4Jq+08p/KuSwHCtj2i+mXaZgyvWNGTihP5L5qyA24En6TnI\nNMbCtp07b8FDM5pQs3YEbOGipIP953GA8dbJrBt2LQKbneZDe+MpiSs9ZNKl\nuAhe\r\n=djo1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCYgjcnSbnRRePjT6/fz26pFWGutR6YnjJKNQORy1MR2wIgbTxpdSJA9i8SMp3TxRkWB/OkdrjzWkLVxL7kEsG+SAc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.1-alpha.6_1575934066310_0.32589648128826987"},"_hasShrinkwrap":false},"0.15.1-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.15.1-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.1-alpha.7+8906641a"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8906641aeb26194c321bde7daccd7136fd8d74cc","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.1-alpha.7","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-PptQlAL0rNacSL96m+Cy7Xf724mIirXmyrN8Z2YDY6Tdav3EuQNKJ1rOv/Gdzn2iYZ80jNja6w71nJdLLrdOXw==","shasum":"a6898501de450ce653fe17ff20d15600be7fed2c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.1-alpha.7.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7tnnCRA9TVsSAnZWagAAPmQQAJDI4ZXR45htFdBg/Gba\nSPsS5xS7nt/re9ExWiMB0MFJrhfPegKUHoxXHOe+8VgwarjuGqp82dfXyTMz\nimkM6CwKXwFVxZ8EcSpOpiqOLlnnGfB4aji7tHf+DcgUFHAxkNmOIQrjbse4\nvOW8ae07HZ1zUIaotCLi662YYZCsEn2x5RL7Yyw5J/goZVFLqYS0ish6DI6l\nFZrirk6p0nUUTRPz4KHoTC4VW1NFe+rc88gAqayMZ0AlBzq7cFZctyG6AHmg\nwy1gMReSaYD4pa82yVx61ts62lvOQtCoDTvk4sDCqFr1nNBHR8rw2Jrn4g1M\nnwcw36yg/DjUu+deEb5ntcyLLpdJq2OfM1/6SAY/FG2aurAblP76FzNKxKDQ\ntrQ3SxoHS14nKG4emn2gJT5nnuO4faDaKWvQqfZ7dV4tRwCHBTlpE/s7RfN4\nf6n5DNT69w+RjvxJYBNWU3WPS7QLlc0KQYSCGnQmN2sYSv8xzeZzFH8dcPjM\nUS7LyY0BMPsImYwZ0KxIX6UP21ZIPvCzU90mqbI/4RS/CeemGoJsjorOxqAF\n8ei7l3dJ8/+fou7EnI0eHD1syQ33ONqy5C1h5sL5WQptUAmLVVlQXKPmBZoZ\no7DvzdArze5NhpftrS9O+2JR6aydY1GftmBzWIgj5P/sFTwi6+MJee2mwNpn\nB/A5\r\n=0TXw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC2JAAdnDpib1fV1kRPGihXMtGZeoWrnL+b+v9/2slFBAIgUNKJg1U3xvjVHtWULyp9pSy/2c94+doBjXnKAZbVNlQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.1-alpha.7_1575934438999_0.3354203279625425"},"_hasShrinkwrap":false},"0.15.1-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.15.1-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.1-alpha.8+a14596a6"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"a14596a6dbbd595c5a22a88bd2486461da25001b","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.1-alpha.8","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-YbnrW8W//w8qiANCW1iIDkJdLuN/cPdEZfEaTXINeyS60dqpNFsmzdlCL6mQFdfZwxYDBpTV+hHU1SaKajNfeA==","shasum":"417c89895f9925bae750262af11e684b76aa21ad","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.1-alpha.8.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7tqcCRA9TVsSAnZWagAAkt8P/17QzaDy+Q2JliqudAHu\nVZxwZupMcfjrMqNMahU5WYhrMI6/tJxjwj+3ebqzr4YVATh8P/6EXfWLEe+i\ncBISvCbwy8KhiWT/KdTqfIrLsJv0iREluaPKiyOGqKPhgAEK/16UFbgLbKXY\nPbUkBKrYiK9yf1KLNX6AcX1CjmEAcvIYAtlt+4Dq//Bu3lpMdwxjRWGvg+u+\nTQ/kOVeImKoTS1lsy3Ypnk1thUPHHIS5Xv0DVs7f6JLLjD8nLhKuCjFvNwmc\nAUxiJCPHt1H1A6VdZo9u7jKgU5Jaaa1yztry4zdQoU9VQuKw7nqQL7fci6Ds\nO/GxEAubms6Y2mkrcN6X5Xoo0zaOLkn3txsvfb3g7utGs8amH0NQCTttIPG2\n0+/yN9unf8WPvXlCARVQFcbu3ppR9Paz1B/NhevVVmMz4Zg8NVvlaQwgslSA\nGVUNWbwQhwBsAFibahBwzWPjgupOXqMMjRjFNSh4Y4RKM0jUPvAoxw/2brfJ\nO0Z5Q8NjtBuZ336h/5DCxrwmi0ZffoJstibIJIlyj92j9SmmHA9OFgMVh2hz\nwm1CL132e1zSRDOkHTxY3YTyCRmtDYAZys3a9aS2XMc4uIGghQp8+zgkEfIh\nNzwyR45Us1+o+VcFxOLvdJ7iq1JcUNF/zwrdeQAFKNefT5+Np9vH5S3GWwDC\nMZ3e\r\n=v2Jk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC/GceG35gfOllc3RKA7thQJ7mOtP9HNfpxmpo/i85LpwIgYu4zBZpRFuSKl+3BD5MDSQsasp7VLyC0BNBm7fD62qo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.1-alpha.8_1575934620086_0.9163664450545999"},"_hasShrinkwrap":false},"0.15.1-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.15.1-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.1-alpha.9+16b1cf76"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"16b1cf76a2c6ddda55360d43f0c9ef1fbdaa8d36","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.1-alpha.9","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-GYmQ78Fxjq91d1oJjHSwqlKZKOXX9gRp2Lo68O1vyMlnSY1LdYEnyW/twjjmPldx6n4b654MEO/bbCI8gkLNvg==","shasum":"491e4a54559f11eca2175476046090b342dd9fd0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.1-alpha.9.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7tt6CRA9TVsSAnZWagAAWvQP/jBPfGZ7xeoIAkjd27xm\njQvOFlZ3F+Pt38yvA/+gHaJTiUO3tO0siLPjdlvwyI2vGN+pxbCw0k1Qrb3D\nM8957sYy0wAR1fXzcr0gVLIik3q+fwQlPF+wjhtk8o9YwXSZ3J5ZwHIqDy40\n28TtadfVplBa/1BzMvueYs77d94khGtZpMGDSnA5X0f/dPnNwPbPPvkpHPOG\nukijhmfMUE8G93U/vYdkzf5WJY7G659kQalCXoUGmDB6FL0M/2LDsVTA5rM/\n06pqc2cnP6rfq1mApeCjXx7x2OkdfFPB5zP5Qbi85UleX+tpfSdV037Lo5gL\nAXAnf5wURl9EeT68leX5n2tZlfHAXeiBPCZhZnvxGuM1mHNgaOv5N+c6VwI6\nHOVtRA6qzN71NEWa0+rRQUzTWZ2y/CSdO6vIv7K1F4jeOlFXgItTrJszzzqU\nVOHIiFPdc14BIKxwiUEexI2Vfv7WsZ1fKIhJzxXdlT0IOiE2dzF3o81ipEUE\nrJFBi5P5uV0PRIYKkDjxAHrpQFtInh9Gq+gQCwB32PBaVmL7R6CEdZmX+Eih\nlQFywlAMk4HG8bFzg7GEa07NGVB76aKXJ/P5BsSkKhYBXbVVjcXAHxr4CY5x\nEzYXw/pspJ/t0eCwTe9RwV0EI/dOq4YsBnejbbgPwnfeZYmkSbaURZzM9KYA\neG4t\r\n=wo0B\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDH/j8Vdu/69EDwrT8GRgbnlgsXw7Zg4Ek6y6RO8SCAeAIhAP5rhFxoXS9+EckWuHaxauZrsaDVRtF24oFxXLW2Rbvb"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.1-alpha.9_1575934842088_0.8520845494937261"},"_hasShrinkwrap":false},"0.15.1":{"name":"@react-ssr/nestjs-express","version":"0.15.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.1"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"81736018e73a33586b2d17d779de097d0e887ae9","_id":"@react-ssr/nestjs-express@0.15.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-3GRIaYD3AUx05EbLqouZR0ugnGv4a6hmkNTKphMhdqRascbz12f45aBiNNmS5xjOJs5I5lsiJpX4JxJZ5RNAmg==","shasum":"b76128330bf764237b1b2f154542275cfe851de3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.1.tgz","fileCount":8,"unpackedSize":15937,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7t1GCRA9TVsSAnZWagAAyvEP/3h4eHdLg6+Zn9SkjwD6\njs9gu5+LMCvSgtqUaRIGnjk/vjbDKK0HXAU7FYfDUDh/Efp4pco7/KT3UUlw\nqGbv83vLULtLCodQagpHg8fyjNZ0fU5cvKLhyZqbeJxEwbZ6W5KWHmzZjAWs\nB7IhWpl1C52mgNtwU5wzNX5G+c1Z3so1SbxUaNWj7YlBhrZ6P4s7BdZYF7v2\ntAKlYDI/dC5qwW/xCxcO+jRohckgyyWXp7usZkgeyFGwVjlZvPKQ0DAHQGXd\nVXVNk6gRTUojoFWioDK2Z7qxQxlZGF6m+C5ZiXFP/LSAsWO2YMTrhWOh4FfH\nMGWYFX47Xu6tQDDuRpmNcSEVfl483KDgD1tCEhqA/3pxaGQPQXWqHyWXPCgH\n8ZVagAwIKVOD70zXM+LGwa6WmW0JQm2KdvVm7wh6zSxIcB4/0I4HJByLQGpq\nWWZmHg+W7wUhh2RRD435vZyMkTMLDQj+y2bR+VShd9aqygWkINmcGvZO34d0\ngNKUV9YPhX0kSfJpUJ/gcfzY8nKWfv52xYk93Rkc3mMFMcqJ6FNguF5Aa9kQ\nhOnwjeSPnKqE5dQ3vcRibxpe7WNVyCMx1oiN02StanJQQhlMf6dsKz9sCR0S\n/gmIEpyeV+XJnUIY0tgojN2R1TRBYx1CPtNcc7j6/Nn9JmAjzniVJlN22eEr\nKqZp\r\n=myAo\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCiyLNuXe48KUfBJUraEDqa8W5XlIQeWpmAkhBx1nvbvwIhAOB4Cr5SNqOnmBSd753KPXtJGvE+daHLrUxsTNdUiihD"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.1_1575935301722_0.2966904363479119"},"_hasShrinkwrap":false},"0.15.2-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.15.2-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.2-alpha.4+c6413951"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"c64139515598dec22d2b5e6eadad3488ce7e9479","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.2-alpha.4","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-TDW79ZCpG7lmhq4hV/hVxv7C5hRiwTAna61eSLIvLcBzRbRyhkJvIGNsV7GKeMpfxauKlPpL+u2jyHKccxhWCg==","shasum":"95e003feea69c4c9392d297f63b106e6176503bf","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.2-alpha.4.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd90ivCRA9TVsSAnZWagAAz0wQAIWVkVeO28W9c6vT4ckf\nwkFofBqM5szb/63ONKo7lNEcfBRUb1KGwG/Oghh4SmnTNGSVZA50byfI79G4\nGEhcQuuQcgtlftH8ZVRVxAje8DsQmpMoKRWYgpZbTy8T/xPWVng4HNk0uJkP\nOqqZP/Wq7YcN9x5daatexhaAhBJ2bs4rAyZu8xSjoLfTo0N5RwAqk1quIgBE\nKBFHW7NDOV7EgcTGrw2E+mcwSXw/uxT8yN89JWogK/390b4zj5r7fte7hQQw\nkDPpC9zGSz6WJPJ7OUXyxUB72RRu0aZoJisfeIp5nMAfjG8ezudKCzhv2XTf\n8ndWuRLIgHWa1Q8cheCNnkQnCy/A5dnkValGkjMOaZn3KFm8nFRuVBFhFL8u\n8OTlBZlI37RxP2p5PrIHXso0LqzPSbMKabNpMcCznKjAXJqb+j7Grui8WTN3\nTbDaDGnpAxph9d/Z5Oa1BZmc2W/Ci5oT8a+YVyaDuZeQQvhZvT03TPY854UC\nwjiVLLtVEOZkWBKiZQVNMFOxE+DuhIbrjYx6ZNg6OzxPKo/9cS6lSviCRyVL\nyqa1zxvaeUDiZujcIQpaANyYtJCJ9bI5tR7Xb22UGIzqmPN1lwPub6yiexmN\nIvPWcnKlrYQzGyzfKagWw1+q+DO+7kbHKB1MqSOMJ7yUeIlUo2IEVtOd5wLs\nfyga\r\n=irzK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE67+yVidABMoUaphmmyiHh5Uf5rPaXQGoonhDzsgw+xAiBWf/nGEL/BvhG2stPJkxm91E6L5UH+WRZ8sbXaqgia4A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.2-alpha.4_1576487087622_0.2004142526248116"},"_hasShrinkwrap":false},"0.15.2-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.15.2-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.2-alpha.5+9efc86b7"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"9efc86b7e0337cfa1bcba0ee47560c366822f42d","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Passing the server data to the client `props`\n- Dynamic `props` without caring about SSR\n  - Suitable for dynamic routes like blogging\n- Dynamic `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.2-alpha.5","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-+G/n9GYVfnBb2+AVBxnTfcOGCwyv/8t6ElUol2Tdyv1wV8N+Vb6KbUkSJh79/8k/byHKdjifwRNWJ3h8vjGzLw==","shasum":"a95b4ceee3b140f07a1837188442a51180de24ae","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.2-alpha.5.tgz","fileCount":8,"unpackedSize":15971,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91BGCRA9TVsSAnZWagAA2CkP/RRJy/Hp98ulCRdqJUZd\nT27aVGSzxGvKkk1VYB25nwNzYFFJXseQW9TM8BcEGTYMjDkS8Q9vPlQlDPMB\nHvz9hmDy9+kv6KS2m9raExblwn6lt1rI3aAqC7lW9y4uQaqn0ldsxa9j+c4l\n0Mp+OGVFvlVBFh25J88tQwv+Rg00A5zQCfXwysriLW+0w4wUIgzcUPBk79KF\nAh7CT5XfPIHwHKpyuVTMMVB56uJAHvB9Lrn0nELflRoeL/4Qqk+tWoYvxW7w\nhWni6d0PVO3lfNKT3r2p8Fae74xJTvzT2xUZGqmb33ja5xilNmNKxu3jRihX\nOXOrqej0yv+4Kjx85F2ol0KwHGV1U71ZiRqzW6bjRG8tKWGUpkz03Mdeuxwz\nIUcKwrBhaDXUrYRWhi4YYQsjARKZhB3nLDhvRx/2hbPXq0GpEywraZTL7Z7l\nLQeFU2XQFhMTxKIfa0WTL65jV5BQ+tErP0KH7TUrZBkmJ4zlDgsutvD8Ag/P\nRWTbUIIi0HD3PH2upKmAYgWksBEy3+0mgMrQGwXvUg84lrSYa6vGl2flroDX\nxS0AD5o/3/D/JKe7ICMCsVND8aqhrCjR1MQshDWiSH4PcIDzmN50gLZyMcRq\nW2bTaITuvpYlUI0q5evWTWTQHXovhd1S1jPQpJ8iOLFmSMEfDa9SGyOKQt6O\nFkFS\r\n=p3Jc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFdF6FDtf+aleROp7a99jXi1RSdu/bJrh39rdy2DJqGoAiEAqNB64CC7RaH+PAZZNGA5OhBSc03Y+yjBRT36QKWJxBg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.2-alpha.5_1576489030095_0.9678287306651379"},"_hasShrinkwrap":false},"0.15.2":{"name":"@react-ssr/nestjs-express","version":"0.15.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.2"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"12b5ec953c340d4556a1f24bcab6c237a9ad493b","_id":"@react-ssr/nestjs-express@0.15.2","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-jVTE2y9AYD7jGLTSpPuZJpGrQuDN2uySSUNS/X1ASARKpD9Mv15jnQqyqAc2PBVK5aL78Z0SeUizVw74phQWCA==","shasum":"43e5223c958099278923644c3de1792b404d14be","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.2.tgz","fileCount":8,"unpackedSize":15937,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91HDCRA9TVsSAnZWagAAJxgQAI+kzqcxiFIkCwud78dc\nkrTCVRKOGVensbP2lpBVjznkSRjLBf2td4tqq+clw0jq7tA7fYOlmHsVBIqg\n1T1AZrrw6zAEFdlJo3YzYpDSg8V2O8FkA9GP7CoJWdbzn3SWC+ctzyrG5Lz9\nuuffM70mYsITOPYYii6mo0WFNdf0cJbzis/5oPbiutYPLTUlcLf7ZecVC5Ob\nsaAe/emPIMGQ7mPO6vrvGJ2pWnzcL2Qd+sdULhPLMjYh9GZJjWdAF0ii/6zH\nGwTpTsS+5U7IXozOCiXhBaV2zXPyUBKEAR9yV4C3m7vh98mDXC7uJfOzV96L\ngpEC9I6sh4neOiONgzzWIdgMD+DOoCOKcGaZIDG/p9fAnSxwDIIPC//DmjCX\nMC9a/0JauuBqmgUk8sskDtQGhEJp12Wk+SJkuoANrSdLSrtepZq24vcIuP2r\nO8Wx/hcbdo8tRcU6YuWjZj4Msu8ngzMMQhpS5PSQQ7/HZ9Q48yv4maV8Aw4l\nrWfnN37X6dvMbt668zOi7FgudzKbYQjyWWMj6vEUcwRbnhoUbBUBrVzaPf+x\n2W6NhtxepVR3+0LmQinsrmywP6VM+vK5PyNTH+UjHghELXmTax6VfkenTE+Y\nciLbnJ7CCnRbNZZOd53lYUep9friSBg10kqr7L2Ze9A6aXJ5xs/C0ZM0ZEXf\nEI1S\r\n=OAY6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGlgAbIJLjABVBf4YAIiYN2u32PQuO95LMGTcV2VhkuYAiAX1QT+kL6MaojEQcA8YnySip4JjvHIdW1OZMhnm9BJ3Q=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.2_1576489411518_0.03530039403483065"},"_hasShrinkwrap":false},"0.15.3-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.15.3-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.3-alpha.0+53d6fc10"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"53d6fc10d6c1f1f76f0696bd990f7e1a8048a03a","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.3-alpha.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-Ea25HNoXee46LnvBlpBXsa/PCT//UkuCQ5knexh1SIuTf9reDO/SopUd7e4zcxy34dmEgL3dYM9jW21+FMLeCQ==","shasum":"23d63ea8eab286d0b6b3933a4cc700b1d982227d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.3-alpha.0.tgz","fileCount":8,"unpackedSize":15950,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91NHCRA9TVsSAnZWagAAtEsQAJ3nqiQ4ywYSCCRbjV1B\nK27usb4vFOOmYnLvGQL72Cl/QMesJuXcgHIa686Xu7vdL4TuytVfFx+sL9ZR\nGYwzrSMZG8Zj2JoYWqN0te88klzjE9ceynisbUjH0kwgy1gs3K9roeM4dCke\nau/VbMI50BIZn1r1G9tsOx42buKSdJ/XksX5CPdMedXKdLfWfv8PW3KH5pMf\nll8vlEi9JLodBV3LvaEmMQ6SgCHuAJIVV/SDu7VvO8st7DbTNgDWTyzK+y90\nlKIvjNCigNeh1p2Fk+b0PVxmXN55I1lK0TKOC9sf9tws8fZQ4IrbeTCLPHis\n9QmA9oq99jnl6iveofSGygxiqbH7by3Gb9pUdnWq+KN8U7OgYG9RHsxPXEHG\nMUVDfm2RvAOj2f4lS3N/8+4Rw2CZWWzYYKnd/lYY8tGkw+lS4SwGBVxFkPOW\nxhgFK6iL4i6PlXPTF427yrfyPCS1gkhhx4pwvMusNuTXPM2OhNFgRbRVVCol\n8AdDLznFEG5GjYExLQjnZumupWXLbAlXwyiL4PZuVUl27CjNdPMglOEqRx0U\nMHgq8maocS43GJ2s7jKrBTcSnzRWGmgqtumBZ+xsC6t3QAgjJwO/jSB/VJsS\nypWYz5gocVLQ62o1Pwb1G9zVAGl5mXeBa9b4Lr4abeG8r+p2OuTMkyblKgBh\nmb05\r\n=fGHp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHUTGOmmy88GuWX6D9T0ngTHT2XGEO1XAt5lRiJt0wOKAiAa0M7VJ/RHnVtnBu+vkJ+QWbU4YBFon+LvjSjgGWexSQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.3-alpha.0_1576489798507_0.7296734652816987"},"_hasShrinkwrap":false},"0.15.3-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.15.3-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.3-alpha.1+e9aba71e"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"e9aba71e31ff56b6af91d1bf635c6c58878a6915","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.3-alpha.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-l69ASnI1TibJATATU3zAk7wY7COeTRuVvX9l2Atl1mSbr+iQy2W5qlPfTgMNznYDYuEzFrf74u7d8mgIQDs+mw==","shasum":"2300061f7bc29b137c0b0d73b6426dee738dc7c8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.3-alpha.1.tgz","fileCount":8,"unpackedSize":15950,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91RsCRA9TVsSAnZWagAAeisP/R+Divi2fIrTbsE6OYlt\njAQU1Er0PgMBmeRfARtm1yAWV3egr8wOWY0i5MQz04hgEHw8O4F9alLW6cY7\nEA0nW5kAoGckx5Sng2SYjABh6yFiinHUpkvgfH6kUSuoTTQb7rJotJ6dTnyI\nhmHLZS03Tsxbg7c2bKs4p46atCg/mlNxRNczdH8nD1XwqJrlPd8j7sV1qLam\nZEVU+zKkNMmUqxp2x7nh8UAp/yTw0+rKN7JN2qANm+nsHy8Vs9lM0fd089T8\nY3XCRVlEv/MYmFXXIUsk52JpqUt8aFlsWBj7D/9v8DfKINUIixmefmsaKizz\n1efLCQZZAAgQS4rm+6UdDiQbd6AhiSwSh4qAa7SwOWAqzMctlbQOv1X0dUqj\nxhvGnQbiAduRPzd5AHqD4PxuF4MPnsPmFsbF/xXuaD9KNMqLuYhhOcoKrGCU\n5XnN4g2lzf0+C2WmCA0JUEfgSH3mmvfckz0INANwlBrUuOOp1nfVe9OmB3lU\nPtZwm1DR/dUUGkvKW4gYOZewS/3f6soQov5EDQJnQrtKl+McfA/Ih5+dHeyv\nEYp4Zia/FKA+DM8BwUHsfjz5TB3Tqn69c0RBd7eA+9oKkupNBJ8T7VKeSo0X\nmMNhrWrt9UAxc/OSTcqKN1Em5USEg9/zV+iPrxj9/gEyrUM8aXZAlTMvaH4n\nmRnt\r\n=NS1d\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCljVT/DAuHdMldalkAneRj+j6/fyVtVdfIxHIcM4Bv7gIgQZ8TynZxdutENAHmt6duQ+PdfJKXyopdvf3pdVVwvIo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.3-alpha.1_1576490092301_0.853618426408169"},"_hasShrinkwrap":false},"0.15.3-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.15.3-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.3-alpha.2+62a3b91b"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"62a3b91b1dd506e8f56990ce9b5e0cc552e64590","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.3-alpha.2","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-imDK/S1H4fp4C82cGKCchvSWLVWCjqBfqDVMkkJAhKOLD9sLeuw2QeZ6KTIHoyTNnVnfUtBtBo4qe0vBKgIoQg==","shasum":"9aff7f51e02ad1065604704543e0eda23d0e61e9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.3-alpha.2.tgz","fileCount":8,"unpackedSize":15950,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91UdCRA9TVsSAnZWagAA5TMP/jfv1vCMtlu2iZZB4dU6\n3xhUoJhTPTi9+1wns+XmFPo8SNWsFTIIMldma16Mwt36NlOicJpy0VMCDXDs\nT1Ui63Of7QyQUhZRCD1SQS0J1i7d3kJkQdrtMRhRFsKpx6VMoCGEo6T5IJ+t\nrYeHRxpuixz28tz+rfpAF6wWOs/NfqE92FAviE0W2YXLrklOlLYow6e5UW2i\nu5VZmoLKVn7f/hPthJCnguaGKwGjLLqUd0Y4QdEVATAPzlvE2LWX46o0lBET\nXhhyPhSoTE3qJwd7XUvarHaqYkzpaH7sl/i+sJVCqS0HikaOPydAzKjeKttK\na+pF9pFMmMEz4kP0xBl+ucTy7h/gZ/gZtTRj89DurFKrHLdQQn9D9Eg3V2Tg\ngeXLlGdGzfFpI8Zvz+oxRxNvqJMLLANeSIyZj1/7QAiTDdesi7PEhl0aljq0\nNhmgMJJME5U/oH1ahKZUci7ECpbciCSQ4WK/70kZWomp0S/07dwM//Hs5xcN\ntB7Avr4BMxywkuQzbydqxvv2Kxqb7kw5evGlSIsa897eumkgw8mgikvHYGof\n8OyuPBpGaU1Flj67UUTgr2l/ENy16+OYywK9u368CPdixdBt5P9YdRTTYiDq\nAlfUxrQwC5Muf68nHVaIHRQTLzmYSikHXuTW6DtbEtmfVXu3+rTjg+DqCiIH\nNtlc\r\n=Oc2W\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICzXteGusNFCVkYwH6dhNe92BaCZMmEhbJcSRfyPc6ZlAiAYwW5i1K9oakFkBxDl6YGtjANAJ3nmYrrJDcY4sCbO5w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.3-alpha.2_1576490267554_0.5976712358584699"},"_hasShrinkwrap":false},"0.15.3":{"name":"@react-ssr/nestjs-express","version":"0.15.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.3"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4e9dd8356d1c34b5949e5e9633603371c2e0a1b5","_id":"@react-ssr/nestjs-express@0.15.3","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-Al48QoiUeTadipt3cU2+/dv7BSfflAfqr2sLwxgzRuySOrV02n0lfrgHipmAPuuur6o4LM4KHuEUxC303cWEPQ==","shasum":"7d55ba8537a55036962848294e9f5eba1dbfca43","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.3.tgz","fileCount":8,"unpackedSize":15916,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91X7CRA9TVsSAnZWagAArOsP/2n64aFgDBHo3Py9AhpJ\nZv+vCMpftefh6tUQrpeg+/QxyVE6NcpCj/fZIGMbfptOdyMAYpGSMkELPWx8\n92s8jGzMAkJMwc4Q0DAdsKIiqTVhuCccEgRnDavZ/UeK7bkt+C8kLrh7Ul+x\nS/0n+G1fS8GvKMPDM1mQxQsZJObMkWrCKVycsVkK3fuIZbXTOHGlA8cI2lkB\njH+nHwc3tIo4adFRariPmzDgOPOaCgRFXwrfDiF1YVVmrdvUgE1UU8NVrLC1\nagpCtFU2L+O5rxTm3atOJNxSb1Y05bwJowlxoG+VbqzpIhaSTh5Q1nTeBUrd\n1Nbd1+ruT62/aEhFT8OysPmxz1U6r7IPaCU2jhbqMEq/yfSmHIosWH/yWKs2\n0Gu432MTg8vGhEc1TA+w54mh9sxqv+yj4qPCujTnQHmhq1wqGv4U/TGUGFY/\nL3UEi/dee/wQ4H5wFvPv55VHJTG80rybCUszEYiys3sqFRGFin38TSHeKdKa\nDRrDuQDBR5mu042TpXTAsbW2oReaMvAjhjSqIVBxHbmmTm3C7XnR13tVXY5b\nfz8XYtZu9wOAnspQ82ib0ONerOT1NohA0NcfdRlU9bqM6Vc8l/ZzKMuqvGue\nIFMQKnDcpTtKMP11E97e9XGXNeX3Z4LvrN+ZR8Ba4Qfh8byQCNXSVpJo+bNQ\nsavI\r\n=DTd9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHSwpTHi2IXKthpOjSqgGjllu6Kld5i8DEDaSrFkq+OxAiEA/oZs71l3l91H4dSIDhqlNR0635T9JsdlENSdHGhC/T4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.3_1576490491239_0.9304810402395376"},"_hasShrinkwrap":false},"0.15.4-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.15.4-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.15.4-alpha.0+36cf103a"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"36cf103a94bfbda43b6bba50b5bdf84b85770c03","readme":"<p align=\"center\">😎 @react-ssr/nestjs-express 😎</p>\n<p align=\"center\">\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"A version of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/v/@react-ssr/nestjs-express.svg\">\n  </a>\n  <a href=\"https://npm.im/@react-ssr/nestjs-express\" alt=\"Downloads of @react-ssr/nestjs-express\">\n    <img src=\"https://img.shields.io/npm/dt/@react-ssr/nestjs-express.svg\">\n  </a>\n</p>\n\n## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nPopulate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\nasync function bootstrap() {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n}\n\nbootstrap();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nThen just run `npm start` and go to `http://localhost:3000`, you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other non CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Emotion\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With styled-components\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n### With Material UI\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With Ant Design\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n## Handle Large Data\n\nWe may come across the error [\"431 Request Header Fields Too Large\"](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/431) because Node.js has a threshold of http request header size. (The default value is 8kB.)\n\nTo overcome this, we must specify `--max-http-header-size` option to Node.js:\n\n### On Development with Nodemon in TypeScript\n\n**nodemon.json**\n\n```json\n{\n  \"watch\": [\n    \"server\"\n  ],\n  \"execMap\": {\n    \"ts\": \"cross-env TS_NODE_PROJECT=tsconfig.server.json node --max-http-header-size 512000 -r ts-node/register\"\n  }\n}\n```\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"nodemon server/main.ts\"\n  }\n}\n```\n\n### On Production\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=production node --max-http-header-size 512000 server/main.js\"\n  }\n}\n```\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[The React View Template Engine for Express](https://dev.to/saltyshiomix/the-react-view-template-engine-for-express-42f0)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.15.4-alpha.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-eUz7lvSnV9C37o8Y2t3+FhWfvz4Lz6b4W/1I9flJQOu1Qbyr6haTbdSV1t8AdAfTLLm8QVV3mg5zmW4BtxYTjw==","shasum":"7da55af822f363b7becfaeea2abdbedd3b9abf89","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.15.4-alpha.0.tgz","fileCount":8,"unpackedSize":15950,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91dTCRA9TVsSAnZWagAAGHsP/jI6OMJ9X/BL3KGanPJt\nulJpDVNAoAsJdITklpRBG/zCESh7x7sqUV/zTZlUSt80wthRxtlIeJ/IOEdk\nSFZngtOOtoCRjNsX4o5C7VgYA10BfhEfhybq/qx+zgAFbt9Ke42zrvfbV9E4\nE6WfUseODcXHSW4x0w1iIhGzo56mv/q+W5A7EkwaAeg+PoCTnCXIWncX5AgD\nEsvvBGiOxFj+Vc2cUiXP+Fop7eDoUT+ADKiUqmEuu2Noqln1fQ6lIFPGF2TU\ncEgUDgIpc5y4o5B+aRmfmaAYknZeu+1KmXd1mYNDdjLIW176gAEGaWAIvvxd\nZJFo6QI4+o2hmjQhZaC9IXTlyAjKOWoeIr5IDj/Nr3PPJPl0WNgOaPp6yCgk\nc6q1N0BE1eIYIwj8J6cMbtaTnujmnTVCpuoSkua+OrZegX+wkNUIe7v17qsj\nygc/Uywl9HD8cwcV1lux+zzxV10ZVm+PZo/zCZ5h80qBa8Csq2wS3CtsNmKN\nUXzs1TKrKQq+Innl3FMMIYEZrMhA9mfkPxBR/imXzt0W9STYVWslNNF6HywI\n35FoPb9dHLFRpWmU4d7dbhIUXDjEvPrr0Oo90PXDR12st9SuUYCDCW77TdkA\nN/xuuIYiP2sJHoQbDdfJXoLfXD9qAxcLnKP+3A2xp+CHDnPprTXuPvYuKVd1\nCqad\r\n=Uv62\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIC7rbjgIWRG1c5kiAphq+c1C+LYXUNrY6Fot8v77Lwa4AiAOVdwIrrK4mKbVOrtHLj69hAdrp+zcY/dIctnxFxnzrw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.15.4-alpha.0_1576490834965_0.10164321387135122"},"_hasShrinkwrap":false},"0.16.0":{"name":"@react-ssr/nestjs-express","version":"0.16.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.16.0"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"4bd1022433d2868d3b98fbb1c2206fcc5eaf8c25","_id":"@react-ssr/nestjs-express@0.16.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-Pk7/5kf9+777Nzt0/DVYeMX7HhmQXe4LZWEeoY/U7IrA1chAYR8Gvp9AQSnAAP+LxS40zCO7q0O/L5YuEa5yxA==","shasum":"cd31bcc6cde048fdec5f1465818669705b5a6004","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.16.0.tgz","fileCount":8,"unpackedSize":15916,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91fuCRA9TVsSAnZWagAAtNYQAJFvvYXhEjjpq5WmatNx\nJvFkoBKIMewf4qbQtx/WLntJjKAsphy4m5W2PFc4jYxDS/eTTT1t9vKvhrzz\n3/v5OesLvf7z4wY+8Soeya2/pzPwyoUWzkUQIuSnoMqK3/BQPgwP8+cl3Lp6\na5XcFJSE8Wi9lCIG2Gz4p2OttrDxQNtDSadKe6Js9KsNGQz8LL4UfJzrIWAa\ncGR+qRhsn77Br7/v2oIIoUqzTcgX529rE4zTP+1nM8EbqZpMcpqsCUlax/VJ\nrcUE9E3ingUXN7cbns/3IQRDzh9AiFwQSMNqgDtSVadVdjYxJ2hJLwLvvC5W\nUp2enim1F4QV9iX7NgzjprpgmdjtKjD15xQJ+Y2gMB49nT6WVogew2iEo/9X\n8Wir+x42LWdId++jt+a5hLVaUzTHPAh3mYAF52bPBbZ3C1vB0PKHawRQPBon\nQjuCGGAw86lVpv2qY+qOJw4YhMCeGiN3IWMXpM+XrvlfkUzlV/SgakXWowx3\nouvR3FTbpMElAHCos6eNukeyH01YPOLPv41MS2R9Q5ems81CY9g7hn5KOOdg\nTofRax3lMn1XmNJGqKDtZ6TJj9ykejKpnMalkuJAbv4G72ZrlpJWNt1oCAew\n14qqBE0CnUDghJU+EWmyzk+aBXi+EEWoDnjPSbs5n69g9KW8PAM+k/XFHe90\nFGkZ\r\n=Mnm3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHGEiNLLq+NMz89fM7Qv3YB2NSfgVjkBX0EWjUfP2qZpAiEA5l3tK+JX5yG6h7K2bn/eHDeRqP87RFzu5Gx9NQnoiSQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.16.0_1576490989827_0.6850001655800118"},"_hasShrinkwrap":false},"0.17.0":{"name":"@react-ssr/nestjs-express","version":"0.17.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.17.0"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2a322e5c475b945bfeca1374a5c0e66a2400ad12","_id":"@react-ssr/nestjs-express@0.17.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-l0OKwrk3DIJcNt/Xcj2c1wP+lZ2l27ehBjjoZyjjBzVXGCXz11TxMm99FcXx+hkcP0ph5OU78C/wYrBo9gXhvw==","shasum":"f7fd2881a15bb78971466c5d76b015c5c5c2f184","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.17.0.tgz","fileCount":8,"unpackedSize":15091,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91l6CRA9TVsSAnZWagAAmuYP/RXa9Wzij1+st3VRMJtU\nmt6CnUQX997SHft4asoKAIVuqcJw2arShhp+WLqjcmEeQkTSZV+Mde0mziCx\n7QHxgATjOZzFvHkfAecehSPW8hLvC7U1aAHvjfRAi88b/GYx7hTLFp1Bf3b7\nJXsU8FhF9qcgJKW5qXuQw+qJImFBUpEr6CeItoeE6da2svkc+O1f1PF29/H1\nCYGbn3J9/9FtD6IgMTm0d/HEH283yDXlYqi3pSioLXuplyMsSIG0NGhNHqs3\ndSo1s6M/sa5J4MNWlq6xGc37BfmE4XrQwppXE5S2YZB5Px6e5KbW6Yds5Uui\nwJkCN1RVACS4Cgt3vr9SppKwQEBJg9CLLZ3PITDngiGmL9lNjrIk+0oToWIw\nZP18knUyBYwt3PUiPP0O4qGsEh3/eH6RMH+0maE9YODuQg6eQJZ0BEzCkwi1\n247dZ8eYUQnSFtLQM/QC6tZYRSrX4U5YYdf9LN+ADxtoN7F8eCsa9r6IOk25\n2Nq+ak3FDHo/VHXYXLpH8rAzvqT/DPWRKYMxxhKs7l4dBiJS0IuEROtSzdoU\n3RMJCRXQ3J2Q5xY20Uwy6RU+cKa/PQUDwHA69dZ8pO7TXhdnatj+9BAYhiPA\nQXzVdlx5yikDd+YizLFNsKuvqFNr3TVCJ13haLbcAmLSi0PeL0nCnwmfy+ZL\nr0HS\r\n=VlWE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDsx3whK79WcYkGiAOpHSSNbJIzLqhaKeh3MnSeNhv5BgIgWQAh+BfhzdY16IPfjZeHnjOdJwaOU00L09tjSguj2M8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.17.0_1576491386153_0.07624936728159137"},"_hasShrinkwrap":false},"0.17.1":{"name":"@react-ssr/nestjs-express","version":"0.17.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","reactjs","react.js","express","expressjs","nestjs","nest","view","view-engine","template-engine","view-template-engine","ssr","server-side-rendering"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.17.1"},"devDependencies":{"@nestjs/common":"^6.10.5","@nestjs/core":"^6.10.5","@nestjs/platform-express":"^6.10.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"2456d330f648f3ca92a48445df1302d4c4ae74bd","_id":"@react-ssr/nestjs-express@0.17.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-ALjtddOGuPXOukMHMmkC3J5bqdioWDNqdd+0ribwy+x+WjYPU/MixCRYP4pPErwZLXPzykBSKVVatfWkvqkQRw==","shasum":"14d18bab66b62e73417bbca08cf73be208d5a742","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.17.1.tgz","fileCount":8,"unpackedSize":14968,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd91tpCRA9TVsSAnZWagAAB3kQAIPq65kqKI1Z+XdCIm6t\nYkCKBS7rgVxV9twGIrdlgDeqOsYh0FPE7mnmf3zSR8rvRGA9vor+GUnziBlo\n/lirzfCg9WKEYGLTZ5QyhmQZ27C8vryKzBg31lcIdHtgFtglKgeApT0aa7p3\nG1F7LwlPhM0NZQkQieKH1vcKcN9A/cnNx4RaoMRtKSoMpbDjrup+oXskgJ3V\nLLRjL25CMGNuMZr8EYwoIt0o1yOpoGkqAlYKC0KVXtMymacb8udYmnl1OFlk\nxHQrh4DJGsRsEZGUUJ9N4CwxYUFgVqiSZfrtuvQY29EqdL/o7GLa6B+lJE3V\n38WMQElzKHxm9MoRD+f6AxkEbpWuuURk13q7EPD0LSm85pFq2eAPopYgwiWM\nM7zsilAc4/WRRJmm4Q1/6vbvRtFrceY0HW8uQEcNMaPAJByAMIRhGJCIXtYx\nMy7Ni4zQawy8m7ux0rEc1WapBiRNPWjSSh6RUczem1IhJEKE9K98Gv3hXPuB\nwc/n+Zu/8K8icX+IMrPUMz4DU8siFJxb52r1mS66tfM6jrOwjHlEVHGF3Gll\nCGJBpcU1glZfEGrtZkGRcogTe/abOOb+CZQGoOBv+mndensDjn4GPAxMDYD5\nRXcYdbqts8332STA+2vSYWMigTBjWBka3YDGQsLPE9oLH2yjmJo3zJ89PTv+\nPrTW\r\n=vbOz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDeQwvLpxH0TY72FDeMqhvR/O6rJyDa9G/kuXE4dGLpbAIgSMCEKrMdcVkcoWPxn7FGiVuEFrL9Xx1sBr1pKDx4dCY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.17.1_1576491880464_0.9280760973978852"},"_hasShrinkwrap":false},"0.17.2":{"name":"@react-ssr/nestjs-express","version":"0.17.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.17.2"},"devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"8d91b57b3eb3216927c6995714b09688f701b77e","_id":"@react-ssr/nestjs-express@0.17.2","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-NirnvZnFw2Ru2k5olfecmnjzCTRSiVFUmz5cjeI9I4hvRHg/i1m8oWwy2hvEAugnGsrkwLdW1QwJTapcce9F+Q==","shasum":"06f98e682ed127f9a27242493d9cc81777dd088c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.17.2.tgz","fileCount":8,"unpackedSize":14888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd94N7CRA9TVsSAnZWagAA+NMP/1lq5rMdd4D/T1UlGiXU\nGIEDkSm2Cs3Cy9JTOqykUSCXBKk/HnLfmcQO97wqkYZ3XYnffKi9Aa+5lpJJ\nXMfFR8jwN8mJVpo/uG2IcONBaArix64OQkl7ribnd1+eTgl6O5RXr7ykynfW\n3IdE/yG6Y3eP/xtLateYSfzgkFclxYJEcKr3yM3tGc9Zr8LTsGMl20cUsx4F\nb+uC+YV+NM+/I+fhrVNCSGniwRkw1vVtLsUWcAbrm+CZBiRcsxgDe6H1jBOS\noyYUViPCxMSdRwadxpXEsRBpYpVciYLtMquMEnKXrcGsnuXRa0pOtpIZ7zeu\n9VTGqVa4ICD5p7QJFwU74W5AXlrfumDIOP6/Jor0pXcaS4ThPlB0gZ+6GCzV\nfnqZQr9x7pj9kXpl3yDDNpfnZSDuyQSNU1gQTf9rrHgtXr8wpHqFnb8CVuzf\nlW7RnZ7GsPRFgxAmDxQ6yOYzOK4mYvGgg4ioCer1Mhl+9MYlcEhBOajL/ofE\n8WMgh2yBWnlToZvDtKpKRt9KLgTMaAKFEWVg+q5jq/EDN0lR711wzGU5d+MJ\nhGU16zn6YPLtcOH7kDSLDbEwZxE7ithfzhhcquzxNqBHje6B+iHvBM8aovI9\nnHLreUe5bkdnXF4d+TOSvmHrttYEA6dEVgtipOBVNHvxRWQc0dK40voeqFFU\nPK7J\r\n=jrZR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDbCBL6E60F4bcWsIsIYmsTiz62Nk4kAmONXcqpPUX29QIhAKAHx7vc9fDYoWns99veWMkxkey1WbbmOcpqTwVfVJSX"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.17.2_1576502139297_0.9824308835677869"},"_hasShrinkwrap":false},"0.17.3":{"name":"@react-ssr/nestjs-express","version":"0.17.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","dependencies":{"@react-ssr/core":"^0.17.3"},"devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6"},"gitHead":"21a23b2b8594874132014865f62d400d9dcc7d38","_id":"@react-ssr/nestjs-express@0.17.3","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-74HczgFKyhy3JivnCXLUNoMUrkJAsRz6KC5r5ZFYQMvvSNe9gEz2wnEhsoXJNFjHECoQGJvf476wqqBkpZhZKA==","shasum":"4788bfefcd4bf2961ac509eceebf26e66b42e9f5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.17.3.tgz","fileCount":8,"unpackedSize":14888,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd94VlCRA9TVsSAnZWagAAcIUQAJYvksBxcjJ01oew4hhq\nPIQGs4qqQPmky9zP3jpOo6lrlhIq3i/gINNWbbVkmBt+YhjwMrA9aL/UbxiX\nCyg+flZJBKMGvtf0Sv3AyYPQgd29j1MAAN53yZt+aKQyCLMrgKjUsiNPO0pw\nbmLggFVxX5Ssk7LRzQzDonKbmH0s3InIfNGD3eJ0QSb/oXhTqV5EdEpYBzDG\n8Fqu0jCBoJYx9txdGxb1BfZ3OC/pphHGuMG8CmTaQp4ZwcwiKzB0HjEo9gw5\nbAeqEp7ccZ4pJxSt+8lbXZjGPIONjfuGXqOdofQXBPzGnxRjwIZfP474pmXo\n1e/skuE3asld8iCwRY4ru2VPnf73D8ZWi934MQOPvJ2TiHjIz+ur/zla3yVZ\n1k0n0AbrfsZMEYbZtGKsFkTZ+2hS1SloI7oEpWDboPLuBLc41Zje8FrS8w5t\nUnQ+H77wN+Fl8MZM/kaPdNYiZigSV1435hsm9RwniKqR1djjI1A3mfsEOTT7\nQIbbb1p/cpzgtxR0v1AKjZAxrnqagp8vqe2F3oTt7bklnjbmmJJGQ1EP2q6y\n1d/8JVbCeFkjkE69ruqann7sgCa00jYCBhLqKZsNePMKqRgfSQ3exRxgcGBn\n+xOU0RKj1ud77An71X4d+ig0jksh+T31B3bbhS9OFQ2ppeEi6PB5O98ogv8S\ng6l1\r\n=tDyU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD1NgwcX4Txsp1ycSN9NW+EHZSSrum36vAVN1LdynjklQIhALUTD+ZcexU99ZnoNBdRPWadY6qij6wXY9tIUNWX+cGo"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.17.3_1576502628822_0.5172295739144348"},"_hasShrinkwrap":false},"0.18.0":{"name":"@react-ssr/nestjs-express","version":"0.18.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.18.0","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"934f0caed6cf3fc0e8f9ed59465a141549339dad","_id":"@react-ssr/nestjs-express@0.18.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-b0wSz5mvZdfqmQNWBJIrIPzkZFeaO2e1hKkurHY87W3IrIrwBm3kEx8oQowZeo/vRyPWgBqYJhyb+u/+gDZQDg==","shasum":"fe74f9756834f18a69ed07f0fbfb5bffe71b603f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.18.0.tgz","fileCount":8,"unpackedSize":14919,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd94mACRA9TVsSAnZWagAA+uEP/jZM9nxDR1mDsuL1mAwH\na1MFDgw99wsmCWzn9oQeXEhRpLTmejL/1Qpwo8Aj1kjPHV1QeGbo89e+pBlG\n5Ka8xgi94ME0B2spKXvbj9ttF6NCGXSRsTRdUlzLqzYXjnfiDJzIkGpsQn3x\nxkDPbU0LaTh5qskfPB0R1wSAaM+4sGD6f70BL7Vk6pFcDSlk0j9BZHRCZvfy\nXGo0PV449a3ptNLMiq835n1H6hNAquEwePrWWCL1HACGXyl66835cRt1iEnh\nyvCV0rC0PEFagSX7kPyPIULhqDsQL1qp2UyJgvKFdS5OXqqW2p4Q+UrcLICD\n41wHi+U3UVAM9/9UCI4G7b+JOPMXPwadBs8c2ON5JDQwkGIlAMdRZ6nozHEG\n+gEYZJqDLwcQwGoIRdnifSX2cMIIXIMyI50JqNb9yC7tXBtDrcxdVHa+ZrOG\nbQEf6YvKmZQWBqjFSN2m5rBcRlhY7PhTY2V9WB7SovEF8bWru2MrZ3vTDTCP\ncWtscgQTDAfvvGBZohkjN/Kzndi2dnG8Yx44xQYmTyjTKGA2+JznS93YMb9S\nugqvf6Jc8PXwnCzrBEJXvUx8GOWK6G9dyL4w9yjuqKvGgF0DB8JXibWuChix\nTQJRslXphn4eF2+LYLF0NJjohphtd4KaJsxRPEN/l9p8z5IDgW5P7BI8ICFe\nZUKC\r\n=jR0d\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCr9TQh8skXcVlCdAS355XdfX6IGa4ZB5wpx4+wjlB/+wIgM8gX17J6nZB+NbCtE1PT243bY4shCrM+D4zwN+9XPsw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.18.0_1576503679660_0.01564367096141539"},"_hasShrinkwrap":false},"0.18.1":{"name":"@react-ssr/nestjs-express","version":"0.18.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.18.1","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"b2e3321b4116f275a6b9828f38cf7a44ea9df360","_id":"@react-ssr/nestjs-express@0.18.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-DIbKjVTggz6TbR//m/teiCDqNOwJrzsk1x3Vg87/l0BP8jKllyKaQuDIUvZ9p7vUaeOq6B9717DLAZRuNPM3Og==","shasum":"ec24488eb350fe44ab3f4038df51670e4b40074a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.18.1.tgz","fileCount":8,"unpackedSize":14473,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd94xKCRA9TVsSAnZWagAAGgIP/1dxcVGDx7glEgVRVIXQ\nPlh7Ggh07WMkjYgypjiOpgdS7gd8CNlZPQ28cINkcZx5hn9qbLMrM3KajuaO\ntAAD0IbvLX+hKD5+r7z+wVYj6nwPC2DpyeTob0AKCgnC1LTEtSFWtqw3XL4z\nsvjKQ96QPGgM5MuqUu2rmzMz+z+HNs5vY4U9focDLQOej9B14CXQ8TKyjHBW\nosqlVsO5KDBgEieTkncg5wyjFV1bIrWGcrzZZyvgoI6HhRnYs5kbBw+XzP7h\nzFjge11BEwAtnbAj+4ApM6xs0XNXIKmpWCG1AU8R9GvGdwek0dri027I6N68\nyjH/FtMkshBaV5vLznG0LG3NFfjZ4HdOZeGINj0Ukj9z9jcpbrRPugT3Qf0M\nJBvSLmgIQxh1bFQNFMw6rnYjLDPdvSbbyBZx5ny6Ipl0Y+AdB6Co90t/F+IF\ndzEwGxHYY+oFDIjgykgZ3MEJR2yGEjbLxxecS+qCVWLAUPsHnHq13z75beG2\nvW5mPWidA9ycSQ2JzJ/EEpn2gGqx4Z59aDsjIhTttEu0PeYAsznElMgAoik/\nE+cQU3ZVXdzt0QIfdz8GJeZMmxMul+y+6brVsdGOYapNIyIfR4tDWHh+wVNu\nmV7JBy89JpK49DvhFfEcizSqvtiFn9FxJiRrHPTiikNTJi4zlkQBjdRHjZLr\nfGq9\r\n=HMfQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDetMpVBrORpasP8LT2ZBzwV0XtBRuudFACH4JHd1STlwIgb1dZ6HAY6zOFASAddC5fhHmEUL0CFQqqENmfa9oqRig="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.18.1_1576504393607_0.8741099662594511"},"_hasShrinkwrap":false},"0.18.2":{"name":"@react-ssr/nestjs-express","version":"0.18.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.18.2","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"4c7dc92cd705d27c3ddfca986154a1d2b64136db","_id":"@react-ssr/nestjs-express@0.18.2","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-Ye/MKJD7l8B7HNgvDvUjg9oejCQILuZv1+bAflYcUwZ6qJ1/uGIEw4n3sTVFqkvxmziHFPKem5H7Xj2SsyfBjw==","shasum":"4f63fa92475690880c5bf1867a2c4aaa98e0d2c9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.18.2.tgz","fileCount":8,"unpackedSize":14897,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd9/sBCRA9TVsSAnZWagAAuzIQAJh3TZGt+MXv6XBJbq5i\ngEfPy1HEkkE8+uN5l8a39f8bJdJL+46E8LMBVLw3MC23NBgvki4ELSn0XtHC\n8SuWaZVg9vky3rs6Opv/9yo0KMKNDraqqKAz63clQMTRXgzeVgGPZK/AooGZ\n1vgkjPEL3xXSp+1BjcyWapwBKfgdQ0o7/o/Lh/TO2YgKgj/zlOuVgEezAFXR\nixcUjC3PJXxm+eonu/6RSxBQKY9Jpu+GV98qTtisNYCLnpmsNqbjD/h6WRH+\njqneBNBRhacJUlz2E5HPpgB3zcp8JKwdTSIRDQx0nydHthZbvtr7C+8dQjOV\n18wXJTnkNh/NJPy6jRg+xqtfnt1qS4Opzke9fkOVER8gYfKKNnOHh1j4qbNb\no35zLDAVs/T9ciT2bfbjIMvSZ9vDzBDRmRkI8sqS6nEom7QkxzldQ+oFB0TF\npuc9VLkUz7pOD0+7oaCWP+uioKke9id2jmHT6E2M+9hDZWkVipFupX8epJj9\n4dkqXHPtoFbE2ZH+8ANreEjEFSSYRMltpKd2zBJKdLjfeyUS2PcSDzYIJENJ\nnocQX/KOpV/18RYz49RkMWnWk+abltY9rGbp57FtHGPvR2hDDpSJDmAmmgWr\nVC6lAek3ff/IzjQhFen0VVGk3Crc3rjJ+uCEHY5JPI25ksxje5wtSuNXatio\nkqgC\r\n=8J8R\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICqaIY34+TiEDca9n5/u6buK45tFZInvO1+Cekmh5fyJAiEA0xRL/pEYZQ+Cm2g6VyRwlzJs9j4nz7WY+FHzS4/rz6I="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.18.2_1576532736578_0.6748954457328118"},"_hasShrinkwrap":false},"0.18.3-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.18.3-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.18.3-alpha.2+a8f14af","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"a8f14af095bf0ed1d458a6b404939a37702e9e4b","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.18.3-alpha.2","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-R9DmXbi5+4LckWnstb54tLwByyWN5gckDGsICTL6MVidgI2S4tVHaZc2GSlS7I/tWbgVdq1pWCmHqnFiBBZyug==","shasum":"645f58d4ef6ea832e37c7a97e02ae433ba07e430","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.18.3-alpha.2.tgz","fileCount":8,"unpackedSize":14929,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+CJDCRA9TVsSAnZWagAAG/cP/RUTFfmiXgonNxfdpzpb\n9K48nfmdOy7Hg6U0ixAKaD3gj/pgK9tzPhRniWYn2+29QvHPhNcC4j6+Y/rs\nOF0La/LqovT3tYU3YWBb3iq3w5yzU/14WkDevN6oF1JfHtxeVGi4e3QxZct4\ntBp9xVzwAfvCVwmHKHXH0mK3sVE1Pc//jhZ9G2H+kdRAEnwqYKUsCwTuS4EA\nmUt/AgoB54DzEPCY6aRpYMeOPUSPUPt8LDSQ+DR8OqGX+Eg4iwcYzg1uuvgY\n3WFIK9HCQEvbw2ylyIVZDSdEei5mg2BvewKgLTENTdF/OoRGAPSju1RGltrI\nY+CPScic1vYuz7r90sZFL4mh15oRtVBczAp5COazHnp7mbzP3dwPaVM8dcoI\nxCtZHtsfjsCLiz9OG9TNJ45QHbtReTsGXQ4t044rkhqIPavYhkXeb7xBtEqB\nKJPaiz1gyEa+JOfqzyxIIjXzfvdfHRWtyqvIeNzClZIYViO6uICy7Y/KPbCi\nH87FTmRo5zZMbohpnHCvyun7JqfR9NBtU/EgozMvX/r12xPb3sgyq2o2lp93\nZIvT/gKNcFtpfeetA8ZBHRoxRMJsj83ccXZ/yK1mEaMgHhaXkQi5PnwjFBpY\npdYw+uxGzBHZazI8gR04urW/oDbFkGO8tgpVY8Fyv5GDaUoq8bKzba6wxdBd\nFejO\r\n=02H9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIB4aLFvnAHfPRP5y+DePP0isIByQKEZV+mMhc4JaUKNpAiBcefItESFCELPa06xWTSxHQGMf+HFtQClro4T2313xWw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.18.3-alpha.2_1576542786842_0.5042736972755093"},"_hasShrinkwrap":false},"0.18.3-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.18.3-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.18.3-alpha.3+2694789","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"26947898b2ddf42558801f041bc523147865814d","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.18.3-alpha.3","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-CLfAtRxW3Eo/X6ccMs7GjWJAfl9Xj+COuJbqJheYYe6kM3L6GeiF7nF69Bdq4UMls0fpEnL81U0QtsgZ4g2jdQ==","shasum":"16d541e74bf115d5d7f234d4fe7a93504697a89d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.18.3-alpha.3.tgz","fileCount":8,"unpackedSize":14929,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+CLjCRA9TVsSAnZWagAAuK4P+QFrUcPmOI4MCtnSyHuV\nqstwmdAwFpUnhoLtOg0ieF7jJj7MJh6fXIUtCYKMVDq8h1WcugARm4+XAMPn\nly4BRtGxptzbBuCKtJzUF/tgZEz5wFhSbQ40SzjoJIC2EC8+xXxNQyjXOVYZ\n1ZHuQ21eLlh6KichfgoDEBSLSwqZbGHRbjREwPtQTQqMMoomc2LHMMDAaZjD\nqJVIN7tLkC7bTsHq6HqnKdq7eCQ5jiN7jrDPWOHGTpMJ/fU1viXvH4wqhGPv\nRKpH7VcsjkywSNjWp77ALPGu6TyR2VwUZ4tDE73U8nC5JI87tCln0HFgsO9c\nj01KTmupjF2PN4hJfVECAKzihnXd3g829XonehsWEN8n/PkLvwwkLL1M8p3X\nhF/sGL22JfRoPuRf9hptMqpr9idioU8y28rgLQa+D8x32u5EjV+3xdKjRTkD\nWJxSPBeQ5+lpS38K1cTb1YqDlhkJR00plI5tPbwBRGQeNTLeDz5NueuneOyf\njP6Qc1Iv0iSKd7tjzaS//QmAJZqubYjdrU8LlN9ELLXWRXt9K/gYH5kALus5\nvZoMr//gFSxnQCXXfFUvibkyR6PuGUyG7vWhHHKQ5J8bgdjIheWKbXGG3qC7\n8ReYNBj7qrHeXzO9gshvMRJXF/eFpXkajfEYewdSaNKVm+MmQ6T+Bumn4mgw\nDcmJ\r\n=JdoZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFepyQAjEDIPWh7SvrsjtK/SkD9HLwmJDm6rZjDSETEUAiBO94dRfEBmX2fcKVFdTk5RZW7NuF6lJF6ZYkTTp7LvqA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.18.3-alpha.3_1576542947556_0.29136487020311264"},"_hasShrinkwrap":false},"0.18.3-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.18.3-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.18.3-alpha.4+1271b66","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"1271b66ca6bc99bf9201b07ccd8740898684e077","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.18.3-alpha.4","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-f66hz3A1lr4LKKkMU0xCj++RKNxDSWDwlOWkSTCAccUK0GBb6sYk5qkVQT4OgwU+/FeUbv/xF8WHHLWi4IhYeA==","shasum":"46e704b1c282fddaba347f0fbb0f030aa9233454","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.18.3-alpha.4.tgz","fileCount":8,"unpackedSize":14929,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+CPoCRA9TVsSAnZWagAANbAP/jNLFAYm7O9skRosBqy/\nVMSEq9TXXhGrij76myIq+D4dDLAFSHssuTtadOEfXmUhzZft6UTWxCa31CNl\n9wcYnr43ZbHudnL/YIi1F8GSHQDPmrOayOE87OD4CSjwE6dFfXs/9R9/ETZU\nXmUUtzVYl3txGByqBpAZLsarJWokokxjFdKyv65Vrd55ECd+8exKkpDT3SaK\nl7zmm3UHuoGZcEe90Ct8y5YFAw+KXXCoQTetfMDh0qrdCOqfI9YFGQObPnG9\nNulKa8nzJtiC1BsomMTy5CkfTAxMYMOmo9L/c4HvCIdX6PsS4hdaI4nvjkuG\nZ7ZRTC5Kn5L/5ySzBnwzanrWMlEqJMCAwVu86o/OPA7U2+xJHFbVtGzQekc+\ntsGkEDt3BcYODTGCXM0c5CzTr+RzAFM/cwz6zej9490U/KPilrLwWo7aI7N5\nYISFM943Kljyquw/C4oKO42OCaJPo2DdWT2QjK0vYi+5ogmtf9qU803UtSRR\n8FpepeSwHySvd7s2TdK064wGCyDD5Gf4WcZq9gVVq77Y7iwqf3f2IrM3C5J9\n+pSyxTTeDHX5hKxOIoHEYt/1D50+4ypqISQQ5GVhlwZqL/ymfXgRuu39b6Wg\n2E9wH408J6TOJ3QCgSWPrQLWmTcnn1x5tApcVyNPeKeRN/eLHDiH/uNscLhF\nKDCQ\r\n=vbyN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEOQN3x+aKaZM9+/wa/HgqM1xypMuIjQpmRHrku5wQVRAiA6RXIZGgf4vmAiC0GIwhxZRIZLOtbmIESEA/yh/ca2Hw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.18.3-alpha.4_1576543208418_0.5794497655719157"},"_hasShrinkwrap":false},"0.18.3-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.18.3-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.18.3-alpha.6+70de518","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"70de51837a10cc34e9c923bc66a9834be1bd1483","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-css-import](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-css-import)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.18.3-alpha.6","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-Mq9nWsrtyqgW6fRI0H5TwOta7SnfkbxkXRB6s2PCv6TGcfeK2nrcj3zFq6OwBRxyKc23TBonEJNsfMlsDaBM4Q==","shasum":"58fe8b4afd1d56d1c13b0562e7a1fc1442751b71","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.18.3-alpha.6.tgz","fileCount":8,"unpackedSize":14929,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+CZyCRA9TVsSAnZWagAAPu0P/01kPMIC09xrvWcWmwSa\nb+hgNnk3Hh0dxmnVu0hBGF13RyDed+LyoxtM+kCZfJFTcTAy1jSMIPWtH2pd\n7g9N3of4QfPuHhMsX32ebItfGUwFFmC94dbGoNcG/IsOrt0cO9cWPgv21JlO\n2hEQT1xasuYyRYnfknuKX0DVLLumVejK+PPWYUSJ1MKxlwMNcqBEDrIT06u6\n6gVcujLc82RJ9DjvSJ+KfuQ8j86NQQcUzD+n8JJIQlNQqvOS9zVhW+4NrsJK\nZLHtAbU/x2Fw6ctAkSn1BwY2b/vZAOHL0ul+fulEZubQa6gImI1YCoVmf34d\nlVf+0arjXtgYVpouxeAv8d4L4WIs9Bte+bYaIQbcozNo+37qQYQWwjgv8ZjI\nyNelAlB34EdHxYWRqf2dBgSmj2RDT7yN7aoolpxqBRxm6S4g7YvfZcuZwsti\nN4SxR1DyxpTchyXe9s2V4I3DYXyOONzl2XYy8oU4Lis0OJmEVP2U/QhEiBnV\n0m/F+zmVF21sFUOxnSsPEiYwPOK+Z9mtZUZVi24e9RvGj0clJsgG1fMij/3N\n1mapW6zHv/JTQCUloDJpULzWaA1GDYyNwlyZnvz/vA6iu9AgFrBIv/0AGqkX\nuoBrCboJ68rBAzLDSE4HHFveyekFkf9jTMwH7WrYF7P2KrtknGqhEejq7uDU\nTkLB\r\n=W081\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEyxCe/Lkp+30KSTDOCAtoxgZQHIQOCGjJ5OW2gLynJ9AiEAiKfTsh0FcGUlAgLmbhdgvMQW1P4YV1iA6SQ3St/VgUY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.18.3-alpha.6_1576543858073_0.9491044211332789"},"_hasShrinkwrap":false},"0.18.3":{"name":"@react-ssr/nestjs-express","version":"0.18.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.18.3","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"93ef115986502169bc9ac91943d4ca35c3a0cab3","_id":"@react-ssr/nestjs-express@0.18.3","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-npaSln6ExJvF7i3gspx3kN2Ovl6l74K1Nsqq3bgYdaLJfheBZPfl6ZrlzR/hn0bb7Mv64KHpsZSsLsJLiXLndw==","shasum":"cfa52731413cdd2aee4bef790515c9d74def0b2d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.18.3.tgz","fileCount":8,"unpackedSize":14998,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+CnICRA9TVsSAnZWagAAm5EP/04Ir9jrKqj8DZUHE4G4\nXil8VyW2Y0AwLupAwf75JCb60ry8640eQQhkPezXpknrEu48+HmyAWgrP53b\n6GlmmpvSRi88eCvDI1/v+XB6ZGLb59w5wvRAgioVCleVLu7ZNvBGylGFUDNX\niHe3l0bfdML19NUNQNdFB9bVRCzbQufbM1v0WRCJp0DgtidgFl0TvC8wMbKk\nHrayAhjQNSAlnhFDqPvsxqjTiD4FBZ1qUJ8YWsQaFTPWMeHZ9VCxHlXp6Dag\n7HxPWJVbpjjzbn8ll8740/2aFoOY1qLjjRjKV83H/Ny7dpodMhRv39PtB1tW\nellYkBESOLxWaXcT6MrGCZtsfMX/NKLV2fHMILonBpEgy+avU5D07G6Ejy8Z\nhmz4GmcjgHgCow4PwfL7UXzdhYOXObktE0XWPAyEShoiSJf0GuSDEhptYTkG\nfc1reeSrUSQAylPN3Iye62w04ruVZdpLDn0WzZB6+f4+ibWZpzbqLfWyhAvQ\nttDChJ8YnC5ohpXn92zq/yHzM8hQXxiBTQ9ih/vm2k/pAguEnIH8Q3V0ZHw9\nqVHJs7fgbgMRCpRsnDrfLLN4hOKe3ZYNEvaJejLnL9KdQIullsexLSp0XSiF\n8TDRkO2CT6Fbizx5eJf3ODYiRkerJ6B+Sd1RIAgH6/qiFw0wWOnBPfA2L23Y\nOm+q\r\n=TlnH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCoPy0sv7bvyav1GyazWhgDWwT8z7YE+guDzfmRiBNK2AIhAIvpZo2AFEl8XgmomIY7PCroPE9HjN4hQvlhyqOJ0oxT"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.18.3_1576544711670_0.7686045771973036"},"_hasShrinkwrap":false},"0.19.0-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.19.0-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.0-alpha.5+72b6b6c","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"72b6b6c604b49d039761ba88dca5fc3f47ed486f","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component\n- HMR when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`./.babelrc`**\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`./tsconfig.json`**\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`./tsconfig.server.json`**\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`./server/main.ts`**\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`./server/app.module.ts`**\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`./server/app.controller.ts`**\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`./views/index.tsx`**\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>Default Title</title>\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**: **Please put `<Main />` component directly under `<body>` tag AND don't wrap `<Main />` component with another components** because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**./views/index.tsx**\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello Layout!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component **anyware**:\n\n**./views/index.tsx**\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**./views/_document.tsx**\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n- [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-document)\n- [examples/custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/custom-views)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.0-alpha.5","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-VY4dLuRguIcuRbvXxyzqO3PwzgUS1qlRWkXqW3AhNk0dlQV56fiOJIurRoqjyGQ3DaW1zr9ycwJwAXFR1bSnPw==","shasum":"647b916308ed6b41bca571c3eba5e3f8773b3951","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.0-alpha.5.tgz","fileCount":8,"unpackedSize":15205,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+GDACRA9TVsSAnZWagAAbsgQAIuSX0rf9efnQmF5E2+H\nuuVZKWIvNomh3O79dzAShg6bHVZT+SK9BdPEIfXeKMxdZv0bp/BxnCFBdxWv\nO2w897+t9IEjh8sr8685GBA9td47KjFG34lTOUTjPWXMLOtFRBIVvqPfPizh\n1Fjvz657JToH8Smv6YiZis72KwN/aPVDpOnJZbSopnbCsCGGgEdMCmAi8Aa+\n8G24Cj61V99ZI6AvhrZwzYtX6fCJJ4Dl4NtCXMYm+2MryqsHlMP90Np6Gw1X\nLEMSyxuFNYaKVbIhcE+YS8QDDzMS8pi9sdZcLwZO2gz6Rw60Ab9hEiF9wVHf\n5KenIzd37x+EAckrFzInyq59jdv7qUUnw0AVZ9/JoFR/KN0c9gEQ/1CC131e\nVkCJxO88L+jb++7Uj0u8nrPWBbHc9ni/bRnw2qknQ7xBuGR+GNxVHfpqwcnJ\n3bd51WEMu9ciikcFEl/P4p7WSTuNqUODOg154L+kSO2/1S9ySfGPuAbDdh1G\nWDyetntWArRhI3vkcTyDPsb3yx+9SG+WoNq7V+vMygSwqRxq7Txea+AMnAPC\nemOKgnHSCdQx7BkhFoCz5VGe0/JsNWHfqw/tEtDBjjhdnMLGjAbMKI9eeNN9\nGsTqyISr9XaVuT2vdvEbO9zqFQ1fP8wLVJLoL79/D+orl+qSt9vWc+OrRa3R\n8TbH\r\n=vZGa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCbVJZtXFjKHALXa1KirwqcG/wRNOAb4ySa6w/EbUxQogIgJqEmh0WRPrI8q83MgtYNpCT1iNegOrXz2cdPP5jhaSs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.0-alpha.5_1576558783947_0.9739772753548619"},"_hasShrinkwrap":false},"0.19.0":{"name":"@react-ssr/nestjs-express","version":"0.19.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.0","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"41fdc1f6aa9964a82b228f83d11e8a50f50774a6","_id":"@react-ssr/nestjs-express@0.19.0","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-MWg3uR+VWtQYIHP55wXeLZQcEBK7RPwALtPyHx3StikSEkINIwBfVQ7ErwsRCzBp2gGBuQk3fytUkhQVjtRanA==","shasum":"31a8855b36327e32aa39162f0e128547cd3123ce","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.0.tgz","fileCount":8,"unpackedSize":15389,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+Mm8CRA9TVsSAnZWagAALNUP/2AshUCtk99tIFDZsR4d\nZXzGsPSyioOfOPGAg6SIg5RodP1bzjSpYh7Y1tcSnOyvpB4qn+s+d3/YjLDy\nyZdlGKkHREwdrJgYJ0VcYlSMM0+CXAkJVKJXkL1IX/zXONpSPUjMYIn74PIm\nnJBE3J4YfzWBer8p2cT/yXrPWdn7Zg+gfREA9xKpsCRX0gvcJv/FYmfFRzWi\nUtYvbQ8QXDwPOdc66BDKbGoMdPsqHg1DdktxYFW4R4RTVma40xVWNGl/aTMC\nSLFqGPFnXGeRpOzZDN5lSjB94uAaBs9oK0e2yCVAEJkaS09L7DjZtbN0oEQs\nGlGCHoAvg0jP5aOiq4bBMUAct5x4kgxakcsEaTfM3j7qj6S0FlgDSyae8ECK\nUUTquOl0Bps9lxlIQHALS9i32vTqfiaGQguqjfrMg6gaUU2Xe8m38DVUZais\n/kvVV+FAEYxRptlzKMD1o+TZlVXr7BKxI1EmnGoOjIB/f/VMtYfEDxO06CMj\nOFBNHB8QgbdcqwmPCxkaGfOccnyP/q82YLxiVLy85vB90Y5Fg5T0GFoYD+gi\nX78pqe19iNejW8FYsmi9Spy6ilQvoyHTQMuZeeJd21y9y+bFCbozHlkaJ9BU\nyJ/UolTW0G/VJHCaV3GQDtoQu53Ur29ZL+5s373g5crjB/cBel6+8QB9QGUw\n6v2u\r\n=gewe\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBG2G9zVb6dYsvVf+sBNapqo8hhL5kkyHM4C/Tr8kYsqAiBYemY0KsDb9tceTA49Rg9CeC35RifKE6pakGNDbWivaw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.0_1576585660429_0.03166104856457608"},"_hasShrinkwrap":false},"0.19.1":{"name":"@react-ssr/nestjs-express","version":"0.19.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.1","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"0adc0bde4d9131dbc4cf8f10986cec43afcbab62","_id":"@react-ssr/nestjs-express@0.19.1","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-jCa7clJGc3aVPPNXrVrEtoxtntOjlVjpKkKD+hoHOUMfzG1PNUVkv7Q3CmhxfmZid1mV0b2q9CCf38oOeAxKLQ==","shasum":"0aeff46f43f5ceef8be09b4d088a8e45f5b8f484","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.1.tgz","fileCount":8,"unpackedSize":15762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+WrrCRA9TVsSAnZWagAALXsP/jD67vM7QnywFZ5NYvlA\nJ052GIziHYy4+E/STfmX8be9fy97AuNjrt8nTJpwot7i9ckBATTx3LUt38mV\nzx5U5aozWvPGWrFbAHPm4s/jhlOF9lUpWzMu5tzGFZMWrUQMwxClYFtISlbZ\nkxuNd8T+Q9/+g9rH5XBCmDR0BiluzLpAfKWm+Q274/AJOa4eWs5UatEbwcBn\njpYbFEpTEs4HDVHnfGHG7WMafU6F75/J2RqLkuXE95cKfp/RQIxNmTNFeZtj\nCb/bf8leYG8Pj7R9JX6etWS6eCq+B7gJzUpJHIAw9xUa5AzT8AriY44ZHaBo\nsyPfZ13ZmMxi6rF8ePeKdkIugrgtcwPwm9MOGH8BguIeclJwZNsvb7Ly/zqq\nt/Z9V0/1YzRw1VLBZde7+9+kiOOVF8WKkmXKQa14gaMu1e3voHi7tXmSOEOp\nBjSYHTZ3gNjay4cEZvbwpBKuuxHuBgsh4UxtYUKZ/0tvj2Lqq4pVtNwbosnB\nF3Z1tXOBvHIS0n6ogqWKCZd18fyyj20Ekszr+qOZdK6LhoKFxmv8+DuULiZt\nArSfjDG4++3tJYVJkDbXrwvN5bYTYyIGiiRlKG8nHxU5Zb2/esgQbEloUfI/\nkOPM9/ym9sWodZL15m1yXneE/4sK5eD569qUi+teuNeiALP8bTmQAeucc/lw\nuvYk\r\n=+Wwg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDBE6f66jdJEHz/cheYZztVOxMDKze45FCjb/6My7znqwIhAKru48/kS20Mh7Qn+x+GylzSLzG7ZTOFUdVM7h+kRkT/"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.1_1576626923309_0.9607817955415368"},"_hasShrinkwrap":false},"0.19.2":{"name":"@react-ssr/nestjs-express","version":"0.19.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.2","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"d413aa845be5778e5be729ca8e95ca1c85a0eae5","_id":"@react-ssr/nestjs-express@0.19.2","_nodeVersion":"12.13.1","_npmVersion":"lerna/3.19.0/node@v12.13.1+x64 (darwin)","dist":{"integrity":"sha512-TQnu0TCMWB1VZ28P7JesPch1p8114Kebji/B1y4Cigu929+Kmlu3TX7pkqVuuD1kaolgX7dg5VEh8eKLoHhsgA==","shasum":"6a564409b7852c63efe5a6fe69102c31e8211f96","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.2.tgz","fileCount":8,"unpackedSize":16127,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+Zu+CRA9TVsSAnZWagAARoAP/jJXFu6ZJjrkJKk+0hJr\nVzO68Uvo+rypCY2YnTJYig6qB7LTPbtqAFSRmUxuykPbCFmYaRmon+K0qkez\n14C+xaaBJw81YXkVej1IbbuHcdZK1risJOJsHYRbmEpesUK0+uUkBkpIcPhG\n7LiH2aFaT2z69F3z/r29wLKMZFQaN+nMTtQlMwolqWWd5rmNj3kWAJ7PBwMt\nDqsv2sR1/W2IeYt3UFv5xz6bcp2eeDd8gs6RAAyX0IIr6JCMzB0kc9vqA8f9\n6g8VNO6/uyfKx4yD8LMgg1GKj6nM4By6HoUW0p7SKWGjhhAAs7aIxSwqIPiQ\nn/TP5lh36yNtxXPM9zDDWNQ1+NUiVFqQ+HKg0HbZKOVETA9kMx8w5JYZLvcL\nq6/X6070wPMpZGFbncyqjMMDJ1VWAWgQIgWpSlQNjeyzGsb1EtrAlD2J8C6F\nJ6mGN0HKwHlC6acI0CfeFWwQ0IFl7JXBhdeScK0JD+toD2XLTsanHWrW68br\nOwt6Y6+JR9XMWEVMfmE+7LZ/Bttjdxx5XQIrWCZSJHr4vN0hRcKLF6uGmpbN\n7lMdLnvKWpiOG96C072n8mLLH9pkKA8ixp7ZqFNpwXteIsdwdzOq3wJ/yIk2\nA5ORaI7PJyLELYP4wYqABs9FMdFGaL2c5JSqfGncL5f3n1frP2lnV+wuiHVH\nKTPg\r\n=ry/c\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDa0O9a6/MFXmrGbr3I//Oz/+vf8mfcmm+WLm/DOYRcjAIhAP6RDuC8xOkClraFHeBkfyMS/tputz2fXDlQoI7EL56U"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.2_1576639421681_0.9440342536237594"},"_hasShrinkwrap":false},"0.19.4-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.19.4-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.4-alpha.7+ec4d6d8","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"ec4d6d825b0763d5ba42dc383644eccbddb971f7","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - HMR (Hot Module Replacement) when `process.env.NODE_ENV !== 'production'`\n  - Automatically reflect to the browser as soon as you save the scripts and even if styles\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.4-alpha.7","_nodeVersion":"12.14.0","_npmVersion":"lerna/3.19.0/node@v12.14.0+x64 (darwin)","dist":{"integrity":"sha512-gS2TSWXNodfkE1oNr8TIzV2VMV1OzBqmb89bdQOfV+ublFS/dsteEcJhSL3ogknF7NJ+ZQBY5gVARdjJ7IBSkw==","shasum":"ff108ae5445863d9c9e2641124538e5ea61cb602","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.4-alpha.7.tgz","fileCount":8,"unpackedSize":16159,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+osoCRA9TVsSAnZWagAAkNMP/1M0m58IHZ1zsyLMjDPq\n4ZmZYnf5SujMBk4uPLCBRKdW+VF8f2dR2O79GbY7zlXrUOXk6lBcv58xlgX3\ny/LXt2/fdFxfZxL0Yd8O5fGYN0cqPowNo/SWnyE/JlUWZwVQvhj2SkFyVcas\n/LB2OEwt5COMxXAopPnPs7QGVVVoPDChsgdSjZDDnJhIkEZrPzc8/1JK8mBe\nvznDfCSp5NQuyK3x61BRe9wb38id9Jmlsfdvstmfm8Zc5kSvJiKthtpNA67B\nSvxg3V+Tp6Ga74mK8Haa9E630tkJV2v74GieqU7WolOn8hZqC6C1VIc+BW+J\nqkmum3jEXL6iW99otLoUujeDR/6OPJQKXRq/p5XbIasEEAk/c7IQh47SRDO2\n3xccslA9uLmRQJVcGT3WLvzGn/1Rwo3CPsClQMVdQToRepTgrrvVBpjRBSXk\nXrG+38+eT4hZ1P4Q2SG3AjuHpuRDmjxmN8t47+dX8+U5v2Eaw8AZyOxsr1Kd\n1CTF/R/lYO9nPj0g/4T8ObFe365XDIDkRJemudxHWUgnEdPbidYkRm0ZkoEu\nj4ssiua/WRoccxH3snOcotge7QYo+Dvv+4hM93wXb2lyinsaUWaF3TKDxjwG\nHrI/NKRjyptgKwXcTtYdLqUbdXd4lE4R2aB5uDVbpMGu1criTep48UFK8NhX\nHIpE\r\n=YOc3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICaARhqwqKmqH7mm+g+lS5hfLjMNVdei7FOci1ZWC09gAiA/85NY4grxfFYqSxrAOD4QDKFFGBXCIqojAb+ej3THoQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.4-alpha.7_1576700711877_0.43121730533410774"},"_hasShrinkwrap":false},"0.19.4":{"name":"@react-ssr/nestjs-express","version":"0.19.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.4","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"c5e1f07dde017b362c04a8e199cf3bd53424334b","_id":"@react-ssr/nestjs-express@0.19.4","_nodeVersion":"12.14.0","_npmVersion":"lerna/3.19.0/node@v12.14.0+x64 (darwin)","dist":{"integrity":"sha512-d/DkXgV0b1H/KuG4avhY3zNQEaV9Dem1lKGm2c5ATKbSxh6eY2sBp5XLNPpN484afhKpg6hLRjDIvEuRFzOgqA==","shasum":"8627576dfd2478df466553cc97aec8b7cecd76cc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.4.tgz","fileCount":8,"unpackedSize":16127,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+o4UCRA9TVsSAnZWagAA7HIP/jWTc7DSu1bz1rfIKIeT\nTwO4CYfuJZKvnecqcHcHHzlz6g6pR45UPbEN5vt5JwZ1FVdvQ2YQpuyomoGt\nA/CfWA+cfw0Xt5OsfpkNPzHiB1syX9B1C97RzCJMbq+cBkGKglwdbYhxdQmr\n1om/MWRqFdnD3L2UDXo1Wemg9LFhQXrNR+Uiq6Qrx0itMr1A6p0mVh2/vCoN\nMkcLHDiYGY223RIvqtNR6eClCTAPcJl9widdF+hMsoLFXkG/W1JgymYNeLxX\nQ6VPe/9tNtR2Ez0IIsMJu1xfW+nMHtsCW/zb5I7BT1h8AsSIR1AouP4JaE3h\nxssw/Oik0c3nYFdcZ3G7OFR2wvI89lienJb0eo8bZFcs/I9uriaCDGNYA7qH\nMyRd9aC0n9AN0MQk6jfWzCCHJFkD3G94aNDfvvYpZ06mxAH5LO6i5KfsSd04\nneYbt6/uKfQcmKuKszDRErd4idi0A247dRw+DDxTMVLfgOy4IMXInBTPScvD\nmwqIkaMuWGlZ46ds97UDKKeq2fPaWmQA9xCsjLgDVWx9mJBwj6FEx3qhocL4\nK8y6eKLd/pvb5osE6mtXl4yVo4n0oBKLOaulRoko7BRtOJVoLRX5X5EgGZK1\n5WU/lQ81Zr3GJeDKg3jsCGneF1E2jjEl0a8l2d8eavlAwCC0EkWyrJE4SNqx\nSDWX\r\n=ulSL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDHO10aK2HkriRJey/5FqM4zqElYEMk3Hqf8+g31Bn59AiEA6+7bKWzkH9H77dAWMs3naMDAP3nCKryRUgwBtf7KYjQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.4_1576701459828_0.31990453056014023"},"_hasShrinkwrap":false},"0.19.5":{"name":"@react-ssr/nestjs-express","version":"0.19.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"e296d90aabc86531df8cba37a02de4ead71fb585","_id":"@react-ssr/nestjs-express@0.19.5","_nodeVersion":"12.14.0","_npmVersion":"lerna/3.19.0/node@v12.14.0+x64 (darwin)","dist":{"integrity":"sha512-Typ/K5mcn4Adj5V/I7+GZrdQyC0hHBGmgd20GLVf6Ms66ed2XlF6WIlNuhbnfnuGhbhVzYweL1BhnaToB70dhQ==","shasum":"080505dcf12cb788c3fa12059f7d874ed272feff","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.5.tgz","fileCount":8,"unpackedSize":16127,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+o++CRA9TVsSAnZWagAA+5UQAJ7WeUg9nM4G9b66S+Zb\nO1RTBz1MXOUhDCc4SXiG6hXJ/G/yTO8efOFbJGigvgsTA7/sf+KHW7os02QH\nOzaJYDb4JbqAgqGb+a9jKaXsq/+35I1o77hDCkualIconPjClnGX2y9tXWm1\nTommDjkvYOQ9TadbVPXssPJ1RQl29zRXa/CVVTEAcYfH4dxKBRC1VEjY5TxM\nOnCP/b2gsNPvbIBPUgLrRTdtpHuHMW6m7VBnXXKJSMfZ5YPImmOy2aFKdifc\nIJeC+ugwQuYMlB3ZZGh3U6fiYAucdgd689engNCsjLn1zE6huZkThIiIrgNU\nqrjs+Y4QGa3wfpouCCVHCL6ZkwA4XUEhio195HT1Dj/5umWxIx8/ki5u/Kxx\noeTVLUFcqdOgmB/R5+7wzpM/KV5JOzl3gSESkcbEtJh1BHMjfwU7QYXxnv4t\nVvFnNNI+ioz5wV9C0ZmJIXrpn7f8/F91SwuY4xtpWR7YOumEGBs69Y3+cemf\n9d5UqkgbL7OzOSSaHK/4/0kuY0XgEBthsdIFwDkR3W0RYCwWpCUMFWakSt9p\nC1sNDwaUvYgzqQ3GEMwvrGcst81p6qCtnpQurQlyAnf6ucxwZpJFc4bFjFGp\nj52Vr0RIBNEp+pabLn9Z+7N9Y6NElFwMcTm+kLS5TC8+le0Y1EGXktJFmPp9\nPMXv\r\n=fYgw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDNmirSNiWokzJzZCoUOvH7/1IgfVxkIW6CrYOufRHMRwIhAJ2dMgcI4xz6wZzxtczds19o+B7YxchSXt/jF7NSvpt+"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.5_1576701885800_0.14250762887979862"},"_hasShrinkwrap":false},"0.19.6":{"name":"@react-ssr/nestjs-express","version":"0.19.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.6","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"9c375b4e1c631620368426dce0a16e8626b3a272","_id":"@react-ssr/nestjs-express@0.19.6","_nodeVersion":"12.14.0","_npmVersion":"lerna/3.19.0/node@v12.14.0+x64 (darwin)","dist":{"integrity":"sha512-E5tz5g7v2HhPvuSFLuXqcb/Yz9MpJF2ZV1tEr8wmRQGWbccUWeAq9AXG11PdC4+r+fRg4thQpP1kUs7DWqHjgw==","shasum":"b0f7cb7e0b93414153926839e21386ed36490e1e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.6.tgz","fileCount":8,"unpackedSize":16127,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd/NIxCRA9TVsSAnZWagAA4j0P/AtMJGRNtBXX7L+FvQnZ\nhxgPUDkwXiKgaFMTlU02cubvzTzmPUI7qsyLDgfOXOaU/PlJkWxE2rUXD7bU\nwvFcyM2M+zEnfXX0kc4/e8Luxginfvh9TsuTwfVhDRF4V/p1Od1+ldRbJdVg\nSGYg4Bb+TJCkpV4r+GwUyMwlONAr1P3FJ8K7xkoXS70g1v7yIshxrupCNEMs\nwY0RBXEKEYt8/9y1V8YqCEFiCSRSebel0rXR1Bt1OtRKPt+oE5QqPMijR9OC\nXju87egJtqOGmTYseoTcGZG2+iqzLSk2QX2meDr1dsgP483gWcaDF0YljMBn\nj8120k6Poefi5T2VPvDwraPIsAMyvduLF3jpTxUcB8fReKh9KECY9nlTSknK\nqgGtKNxxJyCb9UgvDhU4GWwmmI8rmJtK2ioux+qPeTjkWvMYJOPtND+mw8HV\nU7/rqlEp2VwtCM7R77qVRMwR6cu6Pn+mCti9H9VGvOpgEc2OCGfmi3yLiXip\nG+6ciyV8rn8D03uTE4LcT/9zJuTvH8b+6NblxgpdB4DMC7EFf1jMdZDDVWxd\nL1XEMevTTF9EjJW602zGY3G8du4pP/5lYerwUbotvKjWS8E3JMfmdTXoNa8K\ntpYDAKrVAS60NB/YKU1hDP7DzGl6yrTa6BabxoBqwiscAq7UPXNFowq3lQqG\n74Og\r\n=cdJ4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDfKieXpjx80eR/jAQF3mUQuYJK0Pl6/VZum/ibJ11IDAIhANt01ka1UvIjceyFcnAeRYqBSYc3kxMdWboet3/U9Nhe"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.6_1576849968887_0.25535358381589357"},"_hasShrinkwrap":false},"0.19.8-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.19.8-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.8-alpha.9+5495f39","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"5495f391a8550361082a8dd97c43a488f587ca0c","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - HMR (Hot Module Replacement) when `process.env.NODE_ENV !== 'production'`\n  - Automatically reflect to the browser as soon as you save the scripts and even if styles\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.8-alpha.9","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.19.0/node@v12.14.1+x64 (darwin)","dist":{"integrity":"sha512-bSadLNjbic5NUacxEXF4BDArQIPoMdgTVQRoCg8TzGIZPCgBga9gBeTuHEYbWs3bTKs/P2TQjHuhUGEG0MIyJQ==","shasum":"2c19ee8997715ad04268503addad4a942ddac2a0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.8-alpha.9.tgz","fileCount":8,"unpackedSize":16159,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeGIqlCRA9TVsSAnZWagAAwG4QAJZMSyordGE1KuvBMqwI\nMyTSF+6b4A4PD16kpmTI8Q/+8cr1VJn6hyeIuoHzfA5e3qCwXR7/ECkwcOI/\nH4ahaJ8N8ZFvx7ZSu3vrScq/me5zFE44ZY6StbdZZbe+Fgz7+20cY85U//YF\nrBL87RAZ1V6izdXE0uMjb8lkD2vb4rMY5WEGJk7e5gkZnWXRofhgCFYM8/5L\npP8d/c43eFwj/fLwQIcoSXkKbK7ECJJvIpJU90SuYe8FrjhWjglcrY55E7+Z\nRiv84WlTgJ1PZlUigTd4MmmVyTw4XjsCsAJfwdaDobvS5U2asSuv0xv0e3hB\nfJRtzArXNLvc1IEuhIfXN8mWZ0QJkOaP8YrHPkZeVubFlHHgoJljnUOneZXD\nHC+9RnYXOPIzd8bCmCnUe6X91R9NNSvksJndBlxR4+tcoTrX4O1n7JllQfuE\nOl66/uEyx0oVrroJXF/k+mrisJuMhOOltXOoxQKYe9p3Jn2Go4rwNeo6xXxo\n/YeyJ708L2YMakY8YyLAIq91JgUf4nyn20QhE2UHNVoLErF5DF9rVdO0xqK6\na9Y7bfkee79H0kZ2qtbgAGnyIhDcQ9uSUJfkP1+AwdBAzYSlvWxOJUpm6G/N\nBfwYnmmCsZ2EKjjb6IfpNFz2ruwP4NxZsndthC7zIkcFn/c4gz9wFp6cXxX8\nbKCF\r\n=LjmH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCLTm0B37tCfNqQQdWWiX1WXR/Gnkzx1M97E2AxMDsi3gIgTOGHkqDYpFi1GDhW/jt3nbfGtSvVrzgHDRdKxrJqazU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.8-alpha.9_1578666661346_0.6969255546291468"},"_hasShrinkwrap":false},"0.19.8":{"name":"@react-ssr/nestjs-express","version":"0.19.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.8","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"7d4dee56b2662a8d2498acb533fa275da77e6a33","_id":"@react-ssr/nestjs-express@0.19.8","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.19.0/node@v12.14.1+x64 (darwin)","dist":{"integrity":"sha512-PlzbOdzZA6OojF9m0/MpzVeiVTNMI7jyGPehaNKJCTBoZUfCBQ/Ph0m9WxO7n4+EQrs647LUG2TjuwOvd0xFxg==","shasum":"3f2b52755c4feaa8ce61e891840f0e17fe6eaf03","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.8.tgz","fileCount":8,"unpackedSize":16127,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeGIsxCRA9TVsSAnZWagAAPVoP/RLzwAViBbSbNrEiAFNq\nGUS7xydwz9PuA3p56LCdUt1eAziy1UD8EKfEcvIcBddnh0+0Ahgsrle+CLMW\nU58ku56A1fGtMsfzqSxmYZFIG/LB4tHgaHuvUyP0I54rGi4OkrPJYQKlGQXZ\nXBXRhRLw6u+XyzOsEofnHGXjPARGhpzfPYtRNQZblCfKQq4rPWuXwLCtF2Gw\nCgYSWhkkfDHSkaY63tJiuBlurODawPfPG/3zSgQuyxbXTO6KsaJtvMV/NIHW\nBBuvB48j385zq1W+G7ULRsIRYDgrNvLzuGNIPhXjvgtZWtgxtIaoyT0pL2lU\nrF3gpM4h45jut9lKt0RRPlqktSBs/Egl5UjSBC7QRnAAlZqSYUmIL9wDt/bj\noXexX0Ii0QysR4qJrh+qmYxY1lklnS21AkVq8SWcmmloCLqpxR56ClIhkMKM\nAVlNUXoFYfUrFvlpCQo4ZGNE7S9n0mOeiAJrh4/y4lZXmZXlwLfZyTBSLe6U\nS9m5/ySquLRA1AV2nbFTKkjb/Ub1zRwabmz0uRWsJqkfLF3kG+TZoRlY2mRn\nufnAUPQypzjQse2To54bZj/GYqbv8eA42MyXqMCI6BKnvyYKHDLCZlVWTELb\nds5oVv8rDpmIWqjtL9t68agGcBVsSbTsnXY87+VUOjn6Ya7inJmnbWX3/Tdt\nh6Rn\r\n=5FC1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG36Khy3qR7jNHZmGEvqxj4hUQg5AMcuAtqdQD+MGEvPAiAKTFfuQmHvWU5lcfAKGErm2Oi72cFHw3zz01m+INvNLQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.8_1578666800706_0.639104284970579"},"_hasShrinkwrap":false},"0.19.9":{"name":"@react-ssr/nestjs-express","version":"0.19.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.9","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"3b318a0dbec60d05139259761b95e4689fb39f74","_id":"@react-ssr/nestjs-express@0.19.9","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.19.0/node@v12.14.1+x64 (darwin)","dist":{"integrity":"sha512-hmIIkZBYa1hOa8UKj9GjlfDy9NEZm1HrZSu+z7MQCXGn2YspwrTmXqlENXpbZ+UOlm3WWltl24r/57zoAjO38g==","shasum":"b4ee30891aeed8201937f1f4e0a4d63c48aa2abc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.9.tgz","fileCount":8,"unpackedSize":16127,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeHqPRCRA9TVsSAnZWagAAFI8P/iEMB/WRMiTyUZyKWYuB\n79uM5WlWVFgyWLKbRu3Dq1omX6TEBhd0La+O3dkyd9om5y3gio/AG+Iktig0\nsA6kdRZl9BuLxfqaYek+HIp0b/raIWo0Rqv5CSuEL5n9CnR44I88WujK0jDU\nf4ESsfoVtXm9yNl+LW/0Kz5NHKFM1f3BmniZ4QWRe9wdeAik+3V2p1EgOYw3\nuYEudoNhM+9Ed+5/MxP4rQxGjZlsCaKd5Yycv1xkr9ihEFoiY/OhUxwKQvxZ\nf/bLsqoch3dXxwqzZspCOfqf1UHcQbjCgZmqOPuOaUZk1hr7uLUvTf4ftggd\nHpIYaKDGiGjaB1iAGfTqhEYOiLdB1uNCDSyBkfatw6DJu+9PtleYFOGCbreJ\n9Y1eaY3fXAFyXhKTU1/SMQc9Mlo7f99NN+7rDq0Td0JWX+kme4DWX6FpgycD\nUcK5MwEvKk5BmQVeTLozHCs/WH+puiJcHm4A8G+/HQ3kkQxotpKJNjFtVAIJ\np7D44M5klNuONhGWdPPCCvF1lzeqoWfryb5eabpNhGHiQF0hmU+MYK2cymcg\nNc///IGyab8Pg7IvSd29si1RlMxRJ+oqEVaM2VOwxEowvBRUTc6WKTul4dym\nuTpgCP8Wof84eeQM36B/MT8X6tk87F5NyG+KeH9xUYcjQDJS42Ydggm8f+ou\nt1JA\r\n=4T1a\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC5TKCD17ekw3gBkOUGja7dXQm+ZKf/B0sBJ4sbWiw2nQIhAN8oyqSHNk+kuYZs5c4zbXKTZDdSsriizUOtW9vOVikD"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.9_1579066320654_0.7369267543265114"},"_hasShrinkwrap":false},"0.19.10-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.19.10-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.10-alpha.2+a837709","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"a837709ae8e219fb8d7bc8d18e6ec540cff30ef7","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - HMR (Hot Module Replacement) when `process.env.NODE_ENV !== 'production'`\n  - Automatically reflect to the browser as soon as you save the scripts and even if styles\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.10-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-PHqDel5nmHhq+n2KtcCGhz0nhwHUQpvHAjReQBQ/uIOFr5b1Oda9i1WK+7hZw2Y8eh3pG+HbWQUKYfqK/ezYIA==","shasum":"be8b2ab3c40ac87649af53e1e1646bbb4a67f7be","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.10-alpha.2.tgz","fileCount":8,"unpackedSize":16161,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXQf3CRA9TVsSAnZWagAA0SEP/jwiz0MJ3skVBHzVX81p\ng88RPw3WvpzcRinQUtHs9YnzDGvYdC6Z2uZRy2fx+Jf6PP6+rJSSu4vzlY+D\nY56TsoWbpQbRtBOvm++3r7QtlAQiBY5f6ipscXCZTZ/TMR817eTpie2fv9S6\nd/D2Bwn5eyh2MdTtpwK7qyV1ec60M3yqMxishAv/quIgnhqcTTHCUSEQInci\nG7bSS9PHD3zWJXjtEN62Kfuo+IKSFf22f+kiyH3W4lrIeOx4sDZvMXB1Kvoq\n92T9B+Ob4unlY5VxOeO68NveWKBUiDst/ffV3UYDFHrfz/XqV9wBPIqHKwmC\n4506uRtZbBHrorTzKPJaoeKSf0TXM7IdearW6b0Zb5wvHIvVJ6VOb4a0ZhOD\n2rRhIcxzd7bU5HZ3PPVk0BjvJ3vz6rUwTOhq8/FQuePBSKzZU/u/1vNA7Gie\nLc6GZxrFCGc/bnseh6Q33kTcjmBs9EtCv4Q11q59XT7Z+qAVch9RCHeUWOwQ\n+CvwZ6xhbehmf4IWuxsgpE+2TirbOJzJ5ZCAOhCNgug2grSQj7YFz4QUZL8f\nBK7bvmcyLX01SyHokBLOseaxYqFwQPIpgKvg1zNL9pRM2A4BPnKDUDRgptuu\nGJVSsRNvth01cPZzARhWpcziZVQTKuROgLzcFVspT8s9BxqGYSuQOaIkhu5u\nF2qp\r\n=bs+I\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCq22oWHFj9vnKUoAcheSRDaL2IHceEsRoFKhOut6PGZwIhAKMhKRJVqjtuguSMsHH5ks2P5PSL4A6siMWjJwT9vx29"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.10-alpha.2_1583155190666_0.10461152631701198"},"_hasShrinkwrap":false},"0.19.10":{"name":"@react-ssr/nestjs-express","version":"0.19.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.10","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"0f8a75eb8aca6b55752b657c96c4c7ea1d7cf838","_id":"@react-ssr/nestjs-express@0.19.10","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-o2pFCaIwtVqaq3qBCOkBMlMbhQpca/MStNIXMyNpEhH4e8Nz5iLnrFFrqBsfyyK5+vapk/OrJnQWSTyiHXKt8Q==","shasum":"ed35fcd1b02e1511f6c5088c7caff441f65b84fd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.10.tgz","fileCount":8,"unpackedSize":16129,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXQjdCRA9TVsSAnZWagAAZdEP/0uWBLSe2eiKq5vG9sif\nNUKIQl/m6G2xPo05EQJev3cZ+2ze6yIf+G/loUv5bBL36MbYEuFqwtmYThA6\nKhpuD9lWzFwarqupn/hOofQHqlGGhqsImuAqoLE+3d5rK+rjN3MLAMPji9Uq\nZGz6Ze9vjPgBDWfXf2LeCvGLWnlU0K29oBN9j2zBIWSzGjsOvErrBSY5s2Nd\nc+T2t2nDQpXA+0J143gcZr6AERYCqlVxzxV4S8c3xxKYSLeolpR0Xhm76Tr6\nVr7cUkQq28dqHZFpfYrxiCT5rp58UQ5vl8lI3NctfR4su52LNyO/B+dPqdF3\nc6XuoTc94eGw76Df0bp/7aI58HFKueuBWTwVPCqtmeBtgoTd5Ekju7QHkTbW\nVP6+EUH8OkEeqUAAOyHZq9Gqka/opBCFMfBR+jK9DPttooGDQRaupla0pXRE\n4qFPcYs9RzXaMdOIp5r+5RuONy/ZZ353P7NScCFH0hbvNOUiXZ+C+rJtVMnu\nRRBcf88APZc/T2CLATCPMX2e1qfvZOHWEkkZqrJ8phLUgZxIPdv7P8VncSaY\n5ySSbRmv42etXUCw7DCCZ2KY4Oc5bRxqbfzsuMQRYl76yRVudqafPLrjBwNx\nogBkscLrNj84nerI0DdJnHPl3rDpdQE1+0CuYUA38tr5k+SVNHWXyPQBJdD4\noGyx\r\n=q6U6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCMTYhvqh13F5COlH1m4gWHrgkeaBhSxRwljzdSBVae9gIhAI5CwdKW8v6fvXxePGuVWr8IBbyO3+ohalmpKaRopl81"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.10_1583155420607_0.2710953908384872"},"_hasShrinkwrap":false},"0.19.11-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.19.11-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.11-alpha.13+a5d7318","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"a5d731824faac353903769e55c04bdc44003cf7c","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - HMR (Hot Module Replacement) when `process.env.NODE_ENV !== 'production'`\n  - Automatically reflect to the browser as soon as you save the scripts and even if styles\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.11-alpha.13","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-JmiTk0D5H7CgGV5JrHo2CVXt9LmrRrq4wk2A/23Oknko9CN/tWBWGx0uGZoq6Ky74DO1x6Q6Cla7pSC+xgWS4A==","shasum":"6e69afc1dca34462bf68e9afb22898bd6ca9bce4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.11-alpha.13.tgz","fileCount":8,"unpackedSize":16163,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXRGvCRA9TVsSAnZWagAAHucP/0r10jYvGOJxrQdeHJn8\ndhvN/llaaaIS0ncryxc5Mi0smoZ/oGrnHOZlSbmp0/k4hOEjciSR+KnMFjX2\nJiLPGG6opbo8h7QWNdLqysMOFx9zQLr6CvhbwiGtNnjMmuR3jWlwh1bLj9vP\nD+r9zFLAH5K2QBuIE+jBZrp9r6aW7MOoGHrj6WVzN7PnRFBPmdaRaEJ8l52I\ncC2BA2hzmAFwG+MPDIhwhU6Cxqf2h2ga4ibVWcdGiYY8zTHTRQM/wkfWGQQQ\nHfL+xGMYn+q/vhjTCA3HAJzIjvz+WtwlyFrCcSTrTMbiLAT8PWsPGa/fXCYI\nj+HFGd3/qIHZju3BDARb4WH7A3UiCmfx5Nj83FgATKJMZNlQuAyfutIPlxaR\nP3pu+js/V9xyPXSywxdmjgnR5epT+y20qnoEDgquo+optbG6ug6EqQ211ieP\nRgowilNqQvWTVUTT+pqFO70MhEp5dAth/SRHWNe1FhBOpUYKSninqduvIqgd\nVGAgdkvYMueZbVH54S/0P4YF42KpDeS2PD5XlM30qozIOqsxitTFppb6GjAV\nvgRcBJyq6N1xroKQsJ23MWwUvZ5HSAX5S1alx/sawwRAMF4LdUhXWZ/jHuMK\n9Pf85WKgwsFMc/bU2fiNiGt7G1+5IEatoEjS+dd3seFTKic/AZy9EE6OzdBX\nSqiR\r\n=RX3S\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICIQPOBRJnCkTMkEWsuhwHTtCb7Zida7PC9fuy3fqpD+AiEAuSeVE05BbkfTqrU1Fy3ANCV3OPkfnywWY/tLy1AwssE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.11-alpha.13_1583157679222_0.741954726778093"},"_hasShrinkwrap":false},"0.19.11":{"name":"@react-ssr/nestjs-express","version":"0.19.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.11","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"5db7a89f256a6af6ec5e1f46bf1badd2d7ca754c","_id":"@react-ssr/nestjs-express@0.19.11","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-nS69OO3Xc0nEPt/Qb8Tu5lzqtDIla5sjH6bzDk0LTOI1pseQ2hogqnnw+m+9mMeBtaVwAoAoDCGXgScTJzoYJA==","shasum":"cea36c6714c3a82c9ab50843f9656d0c3591ffdd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.11.tgz","fileCount":8,"unpackedSize":16129,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXRJKCRA9TVsSAnZWagAAxJ0QAJHv68Iz+lfVvuK/LJVA\nIIRq/MhAr/XUzGBr6YjJwEXvx5YAEJVGeip4sugfNr+QnAevV6HT9uvVhnrA\n17hvGA2kH/7yT855ZnC1PrJpyeJbnhCFeIaxHVSUUhKG3TuySK1ikFR9hRzW\n6GlaBqyurVXCecwbGaafnZvshAPJtyWxRVvxzdvY/twud6SlYWi7MUYrnCGk\nDwPjYFNlNMgaVHGwybZaC4I6hIEtdDvRYIQkNXX/mBF88TPg3BxVXyCyJS8b\nrkuT7vx3LWsIiO1uZz0P5GwzHQWpMtOxRzlw5NDPjVy9nt4jL7HxwbQyMB6l\nzzyro/vCkdGBJXXOpjvT0Nvhk8RZx0T7kTm/UMDSyfGnHK2G3rex4TolKT60\nx9UBYmXbnyIow++Ag4RartNBOQ/nZhK6Nh0RxHSeyBj7CuXJ5I7I1FjD9WCv\nIbXVbpC+vyJf0MrpDU7+vNIhtTOtCqGdCWZa2DvzhtYSPrZAvyTTPYbDpdyY\nHo2ULqDxX7oJ/ye/ptFGX8x3qI3B1vo+A3+BhKZw4zcSP96JyuObrBmUQ4j1\nSdL0LtlO5sbD51tESzM1OlX/PzgTGT4X9zNnu5wKWgXX3qXWGas/gI4LVvrk\nQd/R35DRdVyc6JTl6oXzPnB3fO6mBlb6bJNVkMG7wZaTAS1aVU1joEMN/22R\nQsRG\r\n=Uudk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIElCAIhMARjfu70c2J3B0wNHe8gYZsWJQD0MR7CBCG9aAiEApCym/WHjIP9beQ/ewiB8tEJM5R2A8IiVwJLi5lob2mg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.11_1583157834221_0.6484363074680306"},"_hasShrinkwrap":false},"0.19.12-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.19.12-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.12-alpha.1+0506dd7","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"0506dd74406e759cf332cdf21697e07beb1b3825","readme":"## Overview\r\n\r\n- SSR (Server Side Rendering) as a view template engine\r\n- Dynamic\r\n  - `props`\r\n    - Passing the server data to the React client `props`\r\n    - Suitable for dynamic routes like blogging\r\n  - `Head` component for better SEO\r\n- Developer Experience\r\n  - HMR (Hot Module Replacement) when `process.env.NODE_ENV !== 'production'`\r\n  - Automatically reflect to the browser as soon as you save the scripts and even if styles\r\n\r\n## Usage\r\n\r\nInstall it:\r\n\r\n```bash\r\n# install NestJS dependencies\r\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\r\n\r\n# install @react-ssr/nestjs-express\r\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\r\n```\r\n\r\nAnd add a script to your package.json like this:\r\n\r\n```json\r\n{\r\n  \"scripts\": {\r\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\r\n  }\r\n}\r\n```\r\n\r\nThen, populate files below inside your project:\r\n\r\n**`.babelrc`**:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/nestjs-express/babel\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.json`**:\r\n\r\n```json\r\n{\r\n  \"compilerOptions\": {\r\n    \"target\": \"esnext\",\r\n    \"module\": \"esnext\",\r\n    \"moduleResolution\": \"node\",\r\n    \"jsx\": \"preserve\",\r\n    \"lib\": [\r\n      \"dom\",\r\n      \"dom.iterable\",\r\n      \"esnext\"\r\n    ],\r\n    \"strict\": true,\r\n    \"allowJs\": true,\r\n    \"skipLibCheck\": true,\r\n    \"esModuleInterop\": true\r\n  },\r\n  \"exclude\": [\r\n    \"node_modules\",\r\n    \"ssr.config.js\",\r\n    \".ssr\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.server.json`**:\r\n\r\n```json\r\n{\r\n  \"extends\": \"./tsconfig.json\",\r\n  \"compilerOptions\": {\r\n    \"module\": \"commonjs\"\r\n  },\r\n  \"include\": [\r\n    \"server\"\r\n  ]\r\n}\r\n```\r\n\r\n**`server/main.ts`**:\r\n\r\n```ts\r\nimport { NestFactory } from '@nestjs/core';\r\nimport { NestExpressApplication } from '@nestjs/platform-express';\r\nimport register from '@react-ssr/nestjs-express/register';\r\nimport { AppModule } from './app.module';\r\n\r\n(async () => {\r\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\r\n\r\n  // register `.tsx` as a view template engine\r\n  await register(app);\r\n\r\n  app.listen(3000, async () => {\r\n    console.log(`> Ready on http://localhost:3000`);\r\n  });\r\n})();\r\n```\r\n\r\n**`server/app.module.ts`**:\r\n\r\n```ts\r\nimport { Module } from '@nestjs/common';\r\nimport { AppController } from './app.controller';\r\n\r\n@Module({\r\n  controllers: [\r\n    AppController,\r\n  ],\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n**`server/app.controller.ts`**:\r\n\r\n```ts\r\nimport {\r\n  Controller,\r\n  Get,\r\n  Render,\r\n} from '@nestjs/common';\r\n\r\n@Controller()\r\nexport class AppController {\r\n  @Get()\r\n  @Render('index') // this will render `views/index.tsx`\r\n  public showHome() {\r\n    const user = { name: 'NestJS' };\r\n    return { user };\r\n  }\r\n}\r\n```\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\ninterface IndexProps {\r\n  user: any;\r\n}\r\n\r\nconst Index = ({ user }: IndexProps) => {\r\n  return <p>Hello {user.name}!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\r\n\r\n## Configuration (`ssr.config.js`)\r\n\r\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'default',\r\n  distDir: '.ssr',\r\n  viewsDir: 'views',\r\n  staticViews: [],\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n### `ssr.config.js#id`\r\n\r\nThe id of **UI framework**. (default: `default`)\r\n\r\nIt can be ignored only when the project does not use any UI frameworks.\r\n\r\nSupported UI frameworks are:\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'emotion',\r\n};\r\n```\r\n\r\n### `ssr.config.js#distDir`\r\n\r\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\r\n\r\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\r\n\r\n```js\r\nmodule.exports = {\r\n  // dist folder should be ignored by `.gitignore`\r\n  distDir: 'dist/.ssr',\r\n};\r\n```\r\n\r\n### `ssr.config.js#viewsDir`\r\n\r\nThe place where we put views. (default: `views`)\r\n\r\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\r\n\r\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n\r\n### `ssr.config.js#staticViews`\r\n\r\nIf specified, `react-ssr` generates html cache when production:\r\n\r\n```js\r\nmodule.exports = {\r\n  staticViews: [\r\n    'auth/login',\r\n    'auth/register',\r\n    'about',\r\n  ],\r\n};\r\n```\r\n\r\n### `ssr.config.js#webpack()`\r\n\r\n```js\r\nmodule.exports = {\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    // we can override default webpack config here\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n## Custom Document\r\n\r\nJust put `_document.tsx` into the views root:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/nestjs-express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html lang=\"en\">\r\n        <Head>\r\n          <title>Default Title</title>\r\n          <meta charSet=\"utf-8\" />\r\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\r\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n};\r\n```\r\n\r\n**Note**:\r\n\r\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\r\n\r\nAnd then, use it as always:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nconst Index = (props) => {\r\n  return <p>Hello World!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n\r\n## Dynamic `Head`\r\n\r\nWe can use the `Head` component in any pages:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { Head } from '@react-ssr/nestjs-express';\r\n\r\nconst Index = (props) => {\r\n  return (\r\n    <React.Fragment>\r\n      <Head>\r\n        <title>Dynamic Title</title>\r\n        <meta name=\"description\" content=\"Dynamic Description\" />\r\n      </Head>\r\n      <p>Of course, SSR Ready!</p>\r\n    </React.Fragment>\r\n  );\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n\r\n## Supported UI Framework\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\n### Non CSS-in-JS framework\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\r\n\r\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\r\n\r\nAll we have to do is to load global CSS in `_document` or each page:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html>\r\n        <Head>\r\n          <title>A Sample of Semantic UI React</title>\r\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n}\r\n```\r\n\r\n### With Ant Design\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    [\r\n      \"import\",\r\n      {\r\n        \"libraryName\": \"antd\",\r\n        \"style\": \"css\"\r\n      }\r\n    ]\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n\r\n### With Emotion\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\r\n\r\nIn order to enable SSR, we must install these packages:\r\n\r\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\r\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\r\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"emotion\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n\r\n### With Material UI\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\r\n\r\nWe can use [material-ui](https://material-ui.com) without extra configuration.\r\n\r\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n\r\n### With styled-components\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"styled-components\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n\r\n## Examples\r\n\r\n- **@react-ssr/express**\r\n  - `.jsx`\r\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\r\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\r\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\r\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\r\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\r\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\r\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n  - `.tsx`\r\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\r\n- **@react-ssr/nestjs-express**\r\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\r\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\r\n- **@react-ssr/static**\r\n  - `.jsx`\r\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\r\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\r\n  - `.tsx`\r\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\r\n\r\n## Starters\r\n\r\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\r\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\r\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\r\n\r\n## Articles\r\n\r\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\r\n\r\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\r\n\r\n## Related\r\n\r\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\r\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.12-alpha.1","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-751bR/HWGG+RF4yhsPF7zuGxcI8BAw+rZ4GVLrBpEMA6oh4knNQKTrXdnai2m4YZ1bhnILgFBLFPfZHMwJrKjg==","shasum":"8570e968f06cfb8c314c51aa0d839d2595147fe5","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.12-alpha.1.tgz","fileCount":8,"unpackedSize":16708,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXV9gCRA9TVsSAnZWagAAKG0QAI458+lGmDRw37QOZoPu\nt+ZgsB21z03QHwUuOaCZKBVpuR1VKldA76PmmOyRwFJy0ojjLS/heyPhlsjd\nXpRe8rWKuddxY4sSqvpwEzi6+OdaILMdmyIKhogaR56a+8bsO1o3nsW8NRC0\nYILLHU2db5+SKCBPghm6NOB4PqNwVdbEYgbyTKqXeUmsLUq4acpk8jm52UyD\n5ytxd+M5lOeSqIuywxAVPTVGKF11czIcAnXEhwWFubZ3Pmk+X1L+1sfdWiTc\nkQYIVjdopIHQgKrXl1+7aY52dCZQp8nsnyTo7EuMt7mfg5PLPwZz0FnWCjfV\nIOYkkvUQxkDLsptRyPo0vSDHYfHuvU/L0qTRq21C02jJgwJhlabdlUxdlxyF\n3P+EiFA8tRdSd2frUmlOa+CKwkhTJlvFoicg1hhxKZz6VM2FTFIEQnSZ1cde\nCE2hig5zIAM8+WUet3OluOSWsmoC6gVelO5TePX2e+FTk1bNxYNhnxb2Dk0M\n5Ecr61+FKKm1VVJncu4GmvclhgMEYyrsCP2pRMfQ+f2TNio/xlKzY05l+119\n4H2x9gShRA3041/azKQzv1Odb6Yn7ObjYBGFD2XgW8PYh5O0XmDT1Bt1IXj+\n940o6crti6fx4vPO6JIyCFk5dGun7KeQsepVkj9SVT2iLaJ+6CnZQQIvcaGa\np34l\r\n=z2JU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCUmTCO/S7vmPNnzpG8oXnDdAyIHb/fSRC3lxDh/O0RpwIgWTemXBZLqJur5HDxn9SuQ4EXi18DeR22B6AMyHTq2eo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.12-alpha.1_1583177567821_0.5708529069768835"},"_hasShrinkwrap":false},"0.19.12-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.19.12-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.11","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"5ce0f762e1331d50a4a30aae894e9fce84a159fe","readme":"## Overview\r\n\r\n- SSR (Server Side Rendering) as a view template engine\r\n- Dynamic\r\n  - `props`\r\n    - Passing the server data to the React client `props`\r\n    - Suitable for dynamic routes like blogging\r\n  - `Head` component for better SEO\r\n- Developer Experience\r\n  - HMR (Hot Module Replacement) when `process.env.NODE_ENV !== 'production'`\r\n  - Automatically reflect to the browser as soon as you save the scripts and even if styles\r\n\r\n## Usage\r\n\r\nInstall it:\r\n\r\n```bash\r\n# install NestJS dependencies\r\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\r\n\r\n# install @react-ssr/nestjs-express\r\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\r\n```\r\n\r\nAnd add a script to your package.json like this:\r\n\r\n```json\r\n{\r\n  \"scripts\": {\r\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\r\n  }\r\n}\r\n```\r\n\r\nThen, populate files below inside your project:\r\n\r\n**`.babelrc`**:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/nestjs-express/babel\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.json`**:\r\n\r\n```json\r\n{\r\n  \"compilerOptions\": {\r\n    \"target\": \"esnext\",\r\n    \"module\": \"esnext\",\r\n    \"moduleResolution\": \"node\",\r\n    \"jsx\": \"preserve\",\r\n    \"lib\": [\r\n      \"dom\",\r\n      \"dom.iterable\",\r\n      \"esnext\"\r\n    ],\r\n    \"strict\": true,\r\n    \"allowJs\": true,\r\n    \"skipLibCheck\": true,\r\n    \"esModuleInterop\": true\r\n  },\r\n  \"exclude\": [\r\n    \"node_modules\",\r\n    \"ssr.config.js\",\r\n    \".ssr\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.server.json`**:\r\n\r\n```json\r\n{\r\n  \"extends\": \"./tsconfig.json\",\r\n  \"compilerOptions\": {\r\n    \"module\": \"commonjs\"\r\n  },\r\n  \"include\": [\r\n    \"server\"\r\n  ]\r\n}\r\n```\r\n\r\n**`server/main.ts`**:\r\n\r\n```ts\r\nimport { NestFactory } from '@nestjs/core';\r\nimport { NestExpressApplication } from '@nestjs/platform-express';\r\nimport register from '@react-ssr/nestjs-express/register';\r\nimport { AppModule } from './app.module';\r\n\r\n(async () => {\r\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\r\n\r\n  // register `.tsx` as a view template engine\r\n  await register(app);\r\n\r\n  app.listen(3000, async () => {\r\n    console.log(`> Ready on http://localhost:3000`);\r\n  });\r\n})();\r\n```\r\n\r\n**`server/app.module.ts`**:\r\n\r\n```ts\r\nimport { Module } from '@nestjs/common';\r\nimport { AppController } from './app.controller';\r\n\r\n@Module({\r\n  controllers: [\r\n    AppController,\r\n  ],\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n**`server/app.controller.ts`**:\r\n\r\n```ts\r\nimport {\r\n  Controller,\r\n  Get,\r\n  Render,\r\n} from '@nestjs/common';\r\n\r\n@Controller()\r\nexport class AppController {\r\n  @Get()\r\n  @Render('index') // this will render `views/index.tsx`\r\n  public showHome() {\r\n    const user = { name: 'NestJS' };\r\n    return { user };\r\n  }\r\n}\r\n```\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\ninterface IndexProps {\r\n  user: any;\r\n}\r\n\r\nconst Index = ({ user }: IndexProps) => {\r\n  return <p>Hello {user.name}!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\r\n\r\n## Configuration (`ssr.config.js`)\r\n\r\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'default',\r\n  distDir: '.ssr',\r\n  viewsDir: 'views',\r\n  staticViews: [],\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n### `ssr.config.js#id`\r\n\r\nThe id of **UI framework**. (default: `default`)\r\n\r\nIt can be ignored only when the project does not use any UI frameworks.\r\n\r\nSupported UI frameworks are:\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'emotion',\r\n};\r\n```\r\n\r\n### `ssr.config.js#distDir`\r\n\r\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\r\n\r\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\r\n\r\n```js\r\nmodule.exports = {\r\n  // dist folder should be ignored by `.gitignore`\r\n  distDir: 'dist/.ssr',\r\n};\r\n```\r\n\r\n### `ssr.config.js#viewsDir`\r\n\r\nThe place where we put views. (default: `views`)\r\n\r\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\r\n\r\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n\r\n### `ssr.config.js#staticViews`\r\n\r\nIf specified, `react-ssr` generates html cache when production:\r\n\r\n```js\r\nmodule.exports = {\r\n  staticViews: [\r\n    'auth/login',\r\n    'auth/register',\r\n    'about',\r\n  ],\r\n};\r\n```\r\n\r\n### `ssr.config.js#webpack()`\r\n\r\n```js\r\nmodule.exports = {\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    // we can override default webpack config here\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n## Custom Document\r\n\r\nJust put `_document.tsx` into the views root:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/nestjs-express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html lang=\"en\">\r\n        <Head>\r\n          <title>Default Title</title>\r\n          <meta charSet=\"utf-8\" />\r\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\r\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n};\r\n```\r\n\r\n**Note**:\r\n\r\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\r\n\r\nAnd then, use it as always:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nconst Index = (props) => {\r\n  return <p>Hello World!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n\r\n## Dynamic `Head`\r\n\r\nWe can use the `Head` component in any pages:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { Head } from '@react-ssr/nestjs-express';\r\n\r\nconst Index = (props) => {\r\n  return (\r\n    <React.Fragment>\r\n      <Head>\r\n        <title>Dynamic Title</title>\r\n        <meta name=\"description\" content=\"Dynamic Description\" />\r\n      </Head>\r\n      <p>Of course, SSR Ready!</p>\r\n    </React.Fragment>\r\n  );\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n\r\n## Supported UI Framework\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\n### Non CSS-in-JS framework\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\r\n\r\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\r\n\r\nAll we have to do is to load global CSS in `_document` or each page:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html>\r\n        <Head>\r\n          <title>A Sample of Semantic UI React</title>\r\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n}\r\n```\r\n\r\n### With Ant Design\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    [\r\n      \"import\",\r\n      {\r\n        \"libraryName\": \"antd\",\r\n        \"style\": \"css\"\r\n      }\r\n    ]\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n\r\n### With Emotion\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\r\n\r\nIn order to enable SSR, we must install these packages:\r\n\r\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\r\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\r\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"emotion\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n\r\n### With Material UI\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\r\n\r\nWe can use [material-ui](https://material-ui.com) without extra configuration.\r\n\r\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n\r\n### With styled-components\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"styled-components\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n\r\n## Examples\r\n\r\n- **@react-ssr/express**\r\n  - `.jsx`\r\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\r\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\r\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\r\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\r\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\r\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\r\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n  - `.tsx`\r\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\r\n- **@react-ssr/nestjs-express**\r\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\r\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\r\n- **@react-ssr/static**\r\n  - `.jsx`\r\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\r\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\r\n  - `.tsx`\r\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\r\n\r\n## Starters\r\n\r\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\r\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\r\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\r\n\r\n## Articles\r\n\r\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\r\n\r\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\r\n\r\n## Related\r\n\r\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\r\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.12-alpha.2","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-6ZnnejQxgnnwsBt/Jk7V8+LBxME+sqEuDyxHCBhlbJPD2JgUoWt/7Y/uh9ZE0yxrUal7FDhewpbATJf9ZQa4nA==","shasum":"b9c131e27cc386d10ee00786bb89c5dfaafde607","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.12-alpha.2.tgz","fileCount":8,"unpackedSize":16795,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXWEXCRA9TVsSAnZWagAABqoP/RcwqiyFjP+b8o5l193w\n1f84hQvKk88htRcUPvM5qbbeZxHJyyYGgDnLU+0dd0QcZmkowpIhIpxPswlf\nVHL5o9GoY3vBxxCq+Jk3YazK4LqDhnlnEC3LI75wMNIvZaEJhsTwjTdpLp7D\n+34Lc8Vq2wvC3T7xUhvg8w6Vz216gX+CqNrnW8h2W/9KUo6kdAM41bJxGA5j\nI50SP1V8xBBOmXrv2bj1hFH1cPOvAp0u4vZ8oN9yqrTMIT7Sba7OKJ6w4JPV\njvti0Oslp5wGsOFYh9GhnTKTn7lFt4FOQmu+xhbKZdFVLE+2VPSkyooSlPEN\noAGxFCFA8f88+5R3UVYKb53ImzEsinrzJj/cqt4Csb3U/M3tbSwPq6MW1BrY\nzk/M3SZPWTrc72Y80+NjALr0iSyrqMrDZuzJvBkUm3rFh4dcEyv+bqPQ4Q4k\noU6JB7QjC/D95PxlRAgWh+lxcjU20VCggasuhr9qytbWuiRelvcjQbCjxxOT\no5DQjSoGQC3VIh0SocGTT6E7FPCE4B+S3KOPoATv8rbXB1JMTDgJsrjv0c7r\n0UmHGq+kTvCLJjguvF4B90BOeENHQ8ERZQSTKBFs8ieGapQqdQvRlTL4dF4E\nxvWJKehrtfNr7Y+TmqB9+ciEqrRDiQmytqihDEuELkVxoN+8c2lNxUS/94JW\n+fAG\r\n=+utg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDc3B+W+CjLx5clZGtPUAGyUj9wvDeLe4HnP/5QtN3evgIhANwDMf94VnxvASKYmV3AV1rWqYFLEgBXcuBcHA/BCju6"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.12-alpha.2_1583178007449_0.177667785088236"},"_hasShrinkwrap":false},"0.19.12-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.19.12-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.12-alpha.3+ea265b9","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"ea265b90697d35a2ae28cf67afd7cd542a132f92","readme":"## Overview\r\n\r\n- SSR (Server Side Rendering) as a view template engine\r\n- Dynamic\r\n  - `props`\r\n    - Passing the server data to the React client `props`\r\n    - Suitable for dynamic routes like blogging\r\n  - `Head` component for better SEO\r\n- Developer Experience\r\n  - HMR (Hot Module Replacement) when `process.env.NODE_ENV !== 'production'`\r\n  - Automatically reflect to the browser as soon as you save the scripts and even if styles\r\n\r\n## Usage\r\n\r\nInstall it:\r\n\r\n```bash\r\n# install NestJS dependencies\r\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\r\n\r\n# install @react-ssr/nestjs-express\r\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\r\n```\r\n\r\nAnd add a script to your package.json like this:\r\n\r\n```json\r\n{\r\n  \"scripts\": {\r\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\r\n  }\r\n}\r\n```\r\n\r\nThen, populate files below inside your project:\r\n\r\n**`.babelrc`**:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/nestjs-express/babel\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.json`**:\r\n\r\n```json\r\n{\r\n  \"compilerOptions\": {\r\n    \"target\": \"esnext\",\r\n    \"module\": \"esnext\",\r\n    \"moduleResolution\": \"node\",\r\n    \"jsx\": \"preserve\",\r\n    \"lib\": [\r\n      \"dom\",\r\n      \"dom.iterable\",\r\n      \"esnext\"\r\n    ],\r\n    \"strict\": true,\r\n    \"allowJs\": true,\r\n    \"skipLibCheck\": true,\r\n    \"esModuleInterop\": true\r\n  },\r\n  \"exclude\": [\r\n    \"node_modules\",\r\n    \"ssr.config.js\",\r\n    \".ssr\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.server.json`**:\r\n\r\n```json\r\n{\r\n  \"extends\": \"./tsconfig.json\",\r\n  \"compilerOptions\": {\r\n    \"module\": \"commonjs\"\r\n  },\r\n  \"include\": [\r\n    \"server\"\r\n  ]\r\n}\r\n```\r\n\r\n**`server/main.ts`**:\r\n\r\n```ts\r\nimport { NestFactory } from '@nestjs/core';\r\nimport { NestExpressApplication } from '@nestjs/platform-express';\r\nimport register from '@react-ssr/nestjs-express/register';\r\nimport { AppModule } from './app.module';\r\n\r\n(async () => {\r\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\r\n\r\n  // register `.tsx` as a view template engine\r\n  await register(app);\r\n\r\n  app.listen(3000, async () => {\r\n    console.log(`> Ready on http://localhost:3000`);\r\n  });\r\n})();\r\n```\r\n\r\n**`server/app.module.ts`**:\r\n\r\n```ts\r\nimport { Module } from '@nestjs/common';\r\nimport { AppController } from './app.controller';\r\n\r\n@Module({\r\n  controllers: [\r\n    AppController,\r\n  ],\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n**`server/app.controller.ts`**:\r\n\r\n```ts\r\nimport {\r\n  Controller,\r\n  Get,\r\n  Render,\r\n} from '@nestjs/common';\r\n\r\n@Controller()\r\nexport class AppController {\r\n  @Get()\r\n  @Render('index') // this will render `views/index.tsx`\r\n  public showHome() {\r\n    const user = { name: 'NestJS' };\r\n    return { user };\r\n  }\r\n}\r\n```\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\ninterface IndexProps {\r\n  user: any;\r\n}\r\n\r\nconst Index = ({ user }: IndexProps) => {\r\n  return <p>Hello {user.name}!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\r\n\r\n## Configuration (`ssr.config.js`)\r\n\r\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'default',\r\n  distDir: '.ssr',\r\n  viewsDir: 'views',\r\n  staticViews: [],\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n### `ssr.config.js#id`\r\n\r\nThe id of **UI framework**. (default: `default`)\r\n\r\nIt can be ignored only when the project does not use any UI frameworks.\r\n\r\nSupported UI frameworks are:\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'emotion',\r\n};\r\n```\r\n\r\n### `ssr.config.js#distDir`\r\n\r\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\r\n\r\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\r\n\r\n```js\r\nmodule.exports = {\r\n  // dist folder should be ignored by `.gitignore`\r\n  distDir: 'dist/.ssr',\r\n};\r\n```\r\n\r\n### `ssr.config.js#viewsDir`\r\n\r\nThe place where we put views. (default: `views`)\r\n\r\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\r\n\r\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n\r\n### `ssr.config.js#staticViews`\r\n\r\nIf specified, `react-ssr` generates html cache when production:\r\n\r\n```js\r\nmodule.exports = {\r\n  staticViews: [\r\n    'auth/login',\r\n    'auth/register',\r\n    'about',\r\n  ],\r\n};\r\n```\r\n\r\n### `ssr.config.js#webpack()`\r\n\r\n```js\r\nmodule.exports = {\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    // we can override default webpack config here\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n## Custom Document\r\n\r\nJust put `_document.tsx` into the views root:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/nestjs-express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html lang=\"en\">\r\n        <Head>\r\n          <title>Default Title</title>\r\n          <meta charSet=\"utf-8\" />\r\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\r\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n};\r\n```\r\n\r\n**Note**:\r\n\r\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\r\n\r\nAnd then, use it as always:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nconst Index = (props) => {\r\n  return <p>Hello World!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n\r\n## Dynamic `Head`\r\n\r\nWe can use the `Head` component in any pages:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { Head } from '@react-ssr/nestjs-express';\r\n\r\nconst Index = (props) => {\r\n  return (\r\n    <React.Fragment>\r\n      <Head>\r\n        <title>Dynamic Title</title>\r\n        <meta name=\"description\" content=\"Dynamic Description\" />\r\n      </Head>\r\n      <p>Of course, SSR Ready!</p>\r\n    </React.Fragment>\r\n  );\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n\r\n## Supported UI Framework\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\n### Non CSS-in-JS framework\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\r\n\r\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\r\n\r\nAll we have to do is to load global CSS in `_document` or each page:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html>\r\n        <Head>\r\n          <title>A Sample of Semantic UI React</title>\r\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n}\r\n```\r\n\r\n### With Ant Design\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    [\r\n      \"import\",\r\n      {\r\n        \"libraryName\": \"antd\",\r\n        \"style\": \"css\"\r\n      }\r\n    ]\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n\r\n### With Emotion\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\r\n\r\nIn order to enable SSR, we must install these packages:\r\n\r\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\r\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\r\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"emotion\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n\r\n### With Material UI\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\r\n\r\nWe can use [material-ui](https://material-ui.com) without extra configuration.\r\n\r\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n\r\n### With styled-components\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"styled-components\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n\r\n## Examples\r\n\r\n- **@react-ssr/express**\r\n  - `.jsx`\r\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\r\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\r\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\r\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\r\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\r\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\r\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n  - `.tsx`\r\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\r\n- **@react-ssr/nestjs-express**\r\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\r\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\r\n- **@react-ssr/static**\r\n  - `.jsx`\r\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\r\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\r\n  - `.tsx`\r\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\r\n\r\n## Starters\r\n\r\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\r\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\r\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\r\n\r\n## Articles\r\n\r\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\r\n\r\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\r\n\r\n## Related\r\n\r\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\r\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.12-alpha.3","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-mJtOllX5GDM6ULRA5IvPPXfgSlocVPLRsANHz0c//5nUvc7VHsBv0vkXY9dIDYWwlc7VnWAm5043J6c3S0h2Fg==","shasum":"877c7e2474033dd2426bb785d571fffb97e6915c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.12-alpha.3.tgz","fileCount":8,"unpackedSize":16811,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXWISCRA9TVsSAnZWagAAB3sP/2MEcslYjliNQhpwNMvH\nAZqtl4oFweUXkTthdPbQ7NCjh+yxKrsdAI14KgXLpz4AjlvmN607fZ2QO46z\nrWEmI+t7xOGgtEdreE8/plzKzgzVuhTB7BFykVONIq8V97972V+hp+ItQNIq\nrCRLiwJurdvRJ4UFcWUC14YkwOCBWqAA3AktMPljxMHnqLg8aadGmKJHjJJg\nw9nAiDEgTabtA0o7/CjaPgXEmeTvH6/4T4DLD6ci1dyM+L10CX5dIIRiCkAx\n2Tsk6RI/hX0DHo61q3kH07H3T5HymY82/I0bLZKzBADQl+oGTlDpgyCZFNde\n5SEmKgfgbEDNBd2OHUi9e97I+BHjQln3woKwmmyQX9IGq4reO8rhRaMxk9Cj\nKStq+jvt2qhqfGkuABqGD3M1B/CuTlTpWpLOBT6GssZz3Uk2LB4XpmN9b7pl\n7HQC755KchmQ9ogyNC9+4QjIiEG0itSWoz45SV9Ym8S/qfrAMH44rZaFKUtg\nHA71FDF6TfY/W6BhRQxN+iiOZPXhdFuc9BQNfFqx2Odcp7mRbVFMkgcnW1kX\nvhjSvc15N78BH2WGVtGOtIrBQ7i6rBKRZkZRxMC/58puuuZHRNkIGQLA3/+O\njjkicX3JCRjXH9AQkOk1GS0Ouqf+0EmtPITKGNucbo/hDO8mqGZXMCvTckHg\nUBgp\r\n=eqQG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEGezz/ZEQKylYVQhv2aWliIuSc92tNId9a49gG2FE1eAiEAiAnTC2epH/Eo1Z9c3SxFXYApzWasm81dJDn/SadnfUA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.12-alpha.3_1583178257781_0.024683501234985306"},"_hasShrinkwrap":false},"0.19.12":{"name":"@react-ssr/nestjs-express","version":"0.19.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.12","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"268f1e8b1e3ab9b089058b926900fc3a63b891e0","_id":"@react-ssr/nestjs-express@0.19.12","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-4V/ucjc+qhcE7R21gIKmIh5PEuzDORgrZQ1IEBbolfMQH+efFrhlOIg1trJR5K9izAOak9KD8Z4D9DXhT+rFuQ==","shasum":"bab12b9934382447bf1aab79a9ff89edf55278cf","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.12.tgz","fileCount":8,"unpackedSize":16779,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXWLqCRA9TVsSAnZWagAA8bkP/i4wvG10em6uGZihv+Lb\n9THI/kZ3o4HD3JY1WBbrknz4m0h3PbwE38GvXHjy0Usy7+t7AjneXS1d+9FD\nSUHOwZh3Vc4VBUugkm3KaAuSmnoUMyIQho3dkrN0Hhr8mmERJ/hhPma+JoLg\n0NvSfnc8z/tR+aaT7NxYKKp67ZIGh48ILYX38wGnO+ex3P3WOvzneAATim7U\nqZbENLDyuH6PZY+KOKRufIekXPMEWXmWcaESwGwhpBXgkKJqFlcMDEsvN305\nVh13kU1pLkfd/pnL9X/lflLl6yluyqI7uu2GdRv5RLXmJw2gCKpmK1qVs6nI\n86fK9wmIKAk6GKMYX3jslIT5hEnOyfNbPc5yMAx1laP3Aidq9+A7kgo5RIqP\n5n+ituwJmhGAcosGTr+m/8P7GXikhbPg8poHlNc24eq/nmb5XWMkTMbThA8W\nKQCt+YjCiB8rj0QipFdPimLSUpbMLZdQSCij1c2u4m7p/529g3hiAH2FmoFp\nGYMEg/XhM2FtIHe/Ki6aahw57Lstrsv/YNFxPzIes/FKZDgYHNFQAaQak72B\nlvsCrasc/HMKKBjfmA9TIW1854TttoiVWFzI4esnEsjoXIdCC+BCiV85vDdJ\nAyMEXhkHAbkb4wvZKthXpyrGJ6q3G9ZgHS0h0JLKvMF3bS/YKfQshn4MP3iF\ny68n\r\n=4tTK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCTTNYAjP8qrRqS4Db923iiiybeEEmiTkAXK3Ou6vao/AIhAMBoUnSknhEptF7q6A+ngdsZAps4XxwVZOaNk3Kk1kl8"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.12_1583178473555_0.16670615333165473"},"_hasShrinkwrap":false},"0.19.13-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.19.13-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.13-alpha.0+8344bf1","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"8344bf11dbb3343a5698b59c89bd69db4d870e73","readme":"## Overview\r\n\r\n- SSR (Server Side Rendering) as a view template engine\r\n- Dynamic\r\n  - `props`\r\n    - Passing the server data to the React client `props`\r\n    - Suitable for dynamic routes like blogging\r\n  - `Head` component for better SEO\r\n- Developer Experience\r\n  - HMR (Hot Module Replacement) when `process.env.NODE_ENV !== 'production'`\r\n  - Automatically reflect to the browser as soon as you save the scripts and even if styles\r\n\r\n## Usage\r\n\r\nInstall it:\r\n\r\n```bash\r\n# install NestJS dependencies\r\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\r\n\r\n# install @react-ssr/nestjs-express\r\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\r\n```\r\n\r\nAnd add a script to your package.json like this:\r\n\r\n```json\r\n{\r\n  \"scripts\": {\r\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\r\n  }\r\n}\r\n```\r\n\r\nThen, populate files below inside your project:\r\n\r\n**`.babelrc`**:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/nestjs-express/babel\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.json`**:\r\n\r\n```json\r\n{\r\n  \"compilerOptions\": {\r\n    \"target\": \"esnext\",\r\n    \"module\": \"esnext\",\r\n    \"moduleResolution\": \"node\",\r\n    \"jsx\": \"preserve\",\r\n    \"lib\": [\r\n      \"dom\",\r\n      \"dom.iterable\",\r\n      \"esnext\"\r\n    ],\r\n    \"strict\": true,\r\n    \"allowJs\": true,\r\n    \"skipLibCheck\": true,\r\n    \"esModuleInterop\": true\r\n  },\r\n  \"exclude\": [\r\n    \"node_modules\",\r\n    \"ssr.config.js\",\r\n    \".ssr\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.server.json`**:\r\n\r\n```json\r\n{\r\n  \"extends\": \"./tsconfig.json\",\r\n  \"compilerOptions\": {\r\n    \"module\": \"commonjs\"\r\n  },\r\n  \"include\": [\r\n    \"server\"\r\n  ]\r\n}\r\n```\r\n\r\n**`server/main.ts`**:\r\n\r\n```ts\r\nimport { NestFactory } from '@nestjs/core';\r\nimport { NestExpressApplication } from '@nestjs/platform-express';\r\nimport register from '@react-ssr/nestjs-express/register';\r\nimport { AppModule } from './app.module';\r\n\r\n(async () => {\r\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\r\n\r\n  // register `.tsx` as a view template engine\r\n  await register(app);\r\n\r\n  app.listen(3000, async () => {\r\n    console.log(`> Ready on http://localhost:3000`);\r\n  });\r\n})();\r\n```\r\n\r\n**`server/app.module.ts`**:\r\n\r\n```ts\r\nimport { Module } from '@nestjs/common';\r\nimport { AppController } from './app.controller';\r\n\r\n@Module({\r\n  controllers: [\r\n    AppController,\r\n  ],\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n**`server/app.controller.ts`**:\r\n\r\n```ts\r\nimport {\r\n  Controller,\r\n  Get,\r\n  Render,\r\n} from '@nestjs/common';\r\n\r\n@Controller()\r\nexport class AppController {\r\n  @Get()\r\n  @Render('index') // this will render `views/index.tsx`\r\n  public showHome() {\r\n    const user = { name: 'NestJS' };\r\n    return { user };\r\n  }\r\n}\r\n```\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\ninterface IndexProps {\r\n  user: any;\r\n}\r\n\r\nconst Index = ({ user }: IndexProps) => {\r\n  return <p>Hello {user.name}!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\r\n\r\n## Configuration (`ssr.config.js`)\r\n\r\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'default',\r\n  distDir: '.ssr',\r\n  viewsDir: 'views',\r\n  staticViews: [],\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n### `ssr.config.js#id`\r\n\r\nThe id of **UI framework**. (default: `default`)\r\n\r\nIt can be ignored only when the project does not use any UI frameworks.\r\n\r\nSupported UI frameworks are:\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'emotion',\r\n};\r\n```\r\n\r\n### `ssr.config.js#distDir`\r\n\r\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\r\n\r\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\r\n\r\n```js\r\nmodule.exports = {\r\n  // dist folder should be ignored by `.gitignore`\r\n  distDir: 'dist/.ssr',\r\n};\r\n```\r\n\r\n### `ssr.config.js#viewsDir`\r\n\r\nThe place where we put views. (default: `views`)\r\n\r\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\r\n\r\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n\r\n### `ssr.config.js#staticViews`\r\n\r\nIf specified, `react-ssr` generates html cache when production:\r\n\r\n```js\r\nmodule.exports = {\r\n  staticViews: [\r\n    'auth/login',\r\n    'auth/register',\r\n    'about',\r\n  ],\r\n};\r\n```\r\n\r\n### `ssr.config.js#webpack()`\r\n\r\n```js\r\nmodule.exports = {\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    // we can override default webpack config here\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n## Custom Document\r\n\r\nJust put `_document.tsx` into the views root:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/nestjs-express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html lang=\"en\">\r\n        <Head>\r\n          <title>Default Title</title>\r\n          <meta charSet=\"utf-8\" />\r\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\r\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n};\r\n```\r\n\r\n**Note**:\r\n\r\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\r\n\r\nAnd then, use it as always:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nconst Index = (props) => {\r\n  return <p>Hello World!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n\r\n## Dynamic `Head`\r\n\r\nWe can use the `Head` component in any pages:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { Head } from '@react-ssr/nestjs-express';\r\n\r\nconst Index = (props) => {\r\n  return (\r\n    <React.Fragment>\r\n      <Head>\r\n        <title>Dynamic Title</title>\r\n        <meta name=\"description\" content=\"Dynamic Description\" />\r\n      </Head>\r\n      <p>Of course, SSR Ready!</p>\r\n    </React.Fragment>\r\n  );\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n\r\n## Supported UI Framework\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\n### Non CSS-in-JS framework\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\r\n\r\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\r\n\r\nAll we have to do is to load global CSS in `_document` or each page:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html>\r\n        <Head>\r\n          <title>A Sample of Semantic UI React</title>\r\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n}\r\n```\r\n\r\n### With Ant Design\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    [\r\n      \"import\",\r\n      {\r\n        \"libraryName\": \"antd\",\r\n        \"style\": \"css\"\r\n      }\r\n    ]\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n\r\n### With Emotion\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\r\n\r\nIn order to enable SSR, we must install these packages:\r\n\r\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\r\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\r\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"emotion\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n\r\n### With Material UI\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\r\n\r\nWe can use [material-ui](https://material-ui.com) without extra configuration.\r\n\r\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n\r\n### With styled-components\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"styled-components\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n\r\n## Examples\r\n\r\n- **@react-ssr/express**\r\n  - `.jsx`\r\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\r\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\r\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\r\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\r\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\r\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\r\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n  - `.tsx`\r\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\r\n- **@react-ssr/nestjs-express**\r\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\r\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\r\n- **@react-ssr/static**\r\n  - `.jsx`\r\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\r\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\r\n  - `.tsx`\r\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\r\n\r\n## Starters\r\n\r\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\r\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\r\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\r\n\r\n## Articles\r\n\r\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\r\n\r\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\r\n\r\n## Related\r\n\r\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\r\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.13-alpha.0","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-dZxufcmhtMI2GuEMerTSg0tvG/8swjNbkXUsuObKdumIVjlWrcCa2z5dBirh2+IUpaDFqPP18iV+eyDE2gL+iw==","shasum":"788941a67e0969a7528b01034821e6ded9bc947a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.13-alpha.0.tgz","fileCount":8,"unpackedSize":16811,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXWWgCRA9TVsSAnZWagAASxAP/20Z0IAfk6d505AT8Pz9\nKt68NXPQMauKk5Djrt56FiHzWK2zLtU4THfrIHS2/8T4EIIrGK29opxRfsoq\n4DEWjLLIKFxcksirZ12B96ZZyr/gOuS6yoEOwd2w/SGYPp6LrPMyo14gcHgZ\nnbddts7dA8Q+EFOIKDrqQo2we1pYxPyCvOL6FYIzMDd/+sve1Vf25Owo5tN+\ny8IElySDZMtromBmuLmtPzuKv1Rx8VQw9vwAkm5F1/eEy2/4oyJUOLInSPlc\nQCOAz1+LdDgUJ2AFJKe4PCf9yJacDkUJCgoqruC9+eqGmKIJO08omIOSu/dY\npLSfXsgSfqHAuWaaSqaZgLMuS33r83tzbgH0Q8kwPzrn4MO88gj/o1XHqxy3\nJDbhTYU9/Oa1ZcZwiMiPgYt2UOPFo/aUJtG6H4Ed0ruXu9cQ5ez6kwamn+EG\ny3WKyX+CNno73zXAgAMPIztPAAXECgs5huT0za5FfeuEjPLZRysvJTD4FOdq\nYsQKje0MkJNHtR+Liz8McKYTAGas/v3Mao2saMRBuJHxIxJqjEPxszesoEdT\ngCh1xsQj6TH1SHqTNiVOKifLbfzql8zOs7APH+Pjkx7xMjMjSTW4mW3cipe6\nQzyDNM1zKy3VCQntgOEOlcgYGU/flgoM1AN/np31fjygwul1UvEp4f3DjxWO\n32pR\r\n=2pQS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCin+mJTQe+UW+epsu2az207KKH7Urk8pkShxCGOTZvpwIgK6BSbTnIp38gl8hTnjxKWQ7d6G7EkWXi9GW4ZVleO4E="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.13-alpha.0_1583179167981_0.6461737287113318"},"_hasShrinkwrap":false},"0.19.13-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.19.13-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.13-alpha.1+14d0b78","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"14d0b78a06149584af6ea68b86671f82d32e270f","readme":"## Overview\r\n\r\n- SSR (Server Side Rendering) as a view template engine\r\n- Dynamic\r\n  - `props`\r\n    - Passing the server data to the React client `props`\r\n    - Suitable for dynamic routes like blogging\r\n  - `Head` component for better SEO\r\n- Developer Experience\r\n  - HMR (Hot Module Replacement) when `process.env.NODE_ENV !== 'production'`\r\n  - Automatically reflect to the browser as soon as you save the scripts and even if styles\r\n\r\n## Usage\r\n\r\nInstall it:\r\n\r\n```bash\r\n# install NestJS dependencies\r\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\r\n\r\n# install @react-ssr/nestjs-express\r\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\r\n```\r\n\r\nAnd add a script to your package.json like this:\r\n\r\n```json\r\n{\r\n  \"scripts\": {\r\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\r\n  }\r\n}\r\n```\r\n\r\nThen, populate files below inside your project:\r\n\r\n**`.babelrc`**:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/nestjs-express/babel\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.json`**:\r\n\r\n```json\r\n{\r\n  \"compilerOptions\": {\r\n    \"target\": \"esnext\",\r\n    \"module\": \"esnext\",\r\n    \"moduleResolution\": \"node\",\r\n    \"jsx\": \"preserve\",\r\n    \"lib\": [\r\n      \"dom\",\r\n      \"dom.iterable\",\r\n      \"esnext\"\r\n    ],\r\n    \"strict\": true,\r\n    \"allowJs\": true,\r\n    \"skipLibCheck\": true,\r\n    \"esModuleInterop\": true\r\n  },\r\n  \"exclude\": [\r\n    \"node_modules\",\r\n    \"ssr.config.js\",\r\n    \".ssr\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.server.json`**:\r\n\r\n```json\r\n{\r\n  \"extends\": \"./tsconfig.json\",\r\n  \"compilerOptions\": {\r\n    \"module\": \"commonjs\"\r\n  },\r\n  \"include\": [\r\n    \"server\"\r\n  ]\r\n}\r\n```\r\n\r\n**`server/main.ts`**:\r\n\r\n```ts\r\nimport { NestFactory } from '@nestjs/core';\r\nimport { NestExpressApplication } from '@nestjs/platform-express';\r\nimport register from '@react-ssr/nestjs-express/register';\r\nimport { AppModule } from './app.module';\r\n\r\n(async () => {\r\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\r\n\r\n  // register `.tsx` as a view template engine\r\n  await register(app);\r\n\r\n  app.listen(3000, async () => {\r\n    console.log(`> Ready on http://localhost:3000`);\r\n  });\r\n})();\r\n```\r\n\r\n**`server/app.module.ts`**:\r\n\r\n```ts\r\nimport { Module } from '@nestjs/common';\r\nimport { AppController } from './app.controller';\r\n\r\n@Module({\r\n  controllers: [\r\n    AppController,\r\n  ],\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n**`server/app.controller.ts`**:\r\n\r\n```ts\r\nimport {\r\n  Controller,\r\n  Get,\r\n  Render,\r\n} from '@nestjs/common';\r\n\r\n@Controller()\r\nexport class AppController {\r\n  @Get()\r\n  @Render('index') // this will render `views/index.tsx`\r\n  public showHome() {\r\n    const user = { name: 'NestJS' };\r\n    return { user };\r\n  }\r\n}\r\n```\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\ninterface IndexProps {\r\n  user: any;\r\n}\r\n\r\nconst Index = ({ user }: IndexProps) => {\r\n  return <p>Hello {user.name}!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\r\n\r\n## Configuration (`ssr.config.js`)\r\n\r\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'default',\r\n  distDir: '.ssr',\r\n  viewsDir: 'views',\r\n  staticViews: [],\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n### `ssr.config.js#id`\r\n\r\nThe id of **UI framework**. (default: `default`)\r\n\r\nIt can be ignored only when the project does not use any UI frameworks.\r\n\r\nSupported UI frameworks are:\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'emotion',\r\n};\r\n```\r\n\r\n### `ssr.config.js#distDir`\r\n\r\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\r\n\r\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\r\n\r\n```js\r\nmodule.exports = {\r\n  // dist folder should be ignored by `.gitignore`\r\n  distDir: 'dist/.ssr',\r\n};\r\n```\r\n\r\n### `ssr.config.js#viewsDir`\r\n\r\nThe place where we put views. (default: `views`)\r\n\r\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\r\n\r\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n\r\n### `ssr.config.js#staticViews`\r\n\r\nIf specified, `react-ssr` generates html cache when production:\r\n\r\n```js\r\nmodule.exports = {\r\n  staticViews: [\r\n    'auth/login',\r\n    'auth/register',\r\n    'about',\r\n  ],\r\n};\r\n```\r\n\r\n### `ssr.config.js#webpack()`\r\n\r\n```js\r\nmodule.exports = {\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    // we can override default webpack config here\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n## Custom Document\r\n\r\nJust put `_document.tsx` into the views root:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/nestjs-express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html lang=\"en\">\r\n        <Head>\r\n          <title>Default Title</title>\r\n          <meta charSet=\"utf-8\" />\r\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\r\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n};\r\n```\r\n\r\n**Note**:\r\n\r\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\r\n\r\nAnd then, use it as always:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nconst Index = (props) => {\r\n  return <p>Hello World!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n\r\n## Dynamic `Head`\r\n\r\nWe can use the `Head` component in any pages:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { Head } from '@react-ssr/nestjs-express';\r\n\r\nconst Index = (props) => {\r\n  return (\r\n    <React.Fragment>\r\n      <Head>\r\n        <title>Dynamic Title</title>\r\n        <meta name=\"description\" content=\"Dynamic Description\" />\r\n      </Head>\r\n      <p>Of course, SSR Ready!</p>\r\n    </React.Fragment>\r\n  );\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n\r\n## Supported UI Framework\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\n### Non CSS-in-JS framework\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\r\n\r\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\r\n\r\nAll we have to do is to load global CSS in `_document` or each page:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html>\r\n        <Head>\r\n          <title>A Sample of Semantic UI React</title>\r\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n}\r\n```\r\n\r\n### With Ant Design\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    [\r\n      \"import\",\r\n      {\r\n        \"libraryName\": \"antd\",\r\n        \"style\": \"css\"\r\n      }\r\n    ]\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n\r\n### With Emotion\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\r\n\r\nIn order to enable SSR, we must install these packages:\r\n\r\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\r\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\r\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"emotion\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n\r\n### With Material UI\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\r\n\r\nWe can use [material-ui](https://material-ui.com) without extra configuration.\r\n\r\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n\r\n### With styled-components\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"styled-components\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n\r\n## Examples\r\n\r\n- **@react-ssr/express**\r\n  - `.jsx`\r\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\r\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\r\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\r\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\r\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\r\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\r\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n  - `.tsx`\r\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\r\n- **@react-ssr/nestjs-express**\r\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\r\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\r\n- **@react-ssr/static**\r\n  - `.jsx`\r\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\r\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\r\n  - `.tsx`\r\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\r\n\r\n## Starters\r\n\r\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\r\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\r\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\r\n\r\n## Articles\r\n\r\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\r\n\r\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\r\n\r\n## Related\r\n\r\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\r\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.19.13-alpha.1","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-TDT94LM/2zKWR6qEq/GVa2GgruI7nu+MIlouufu9il4dQ3cqr8WcH5KQ/wFv+Exs0ZG0PJA/JA4mwC52JlcFXg==","shasum":"242f2095dfc014a131ac2ea2325d526a047bae87","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.13-alpha.1.tgz","fileCount":8,"unpackedSize":16811,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXWZmCRA9TVsSAnZWagAAyN8P/1iDoM49aGs76/gbpVNR\naG4LR7DPzkWq6COdCTYYiXOFmsNeriyRtSoJ4TqxjKknkVI49IGcFNJ4l8bi\n7RZPEl2gNDS6z3eNUgAz2/bsNaw6Iggzx9c/XA7Tc+r5Sn1bEM8SGGWaXoXE\nWusrwjRlBgEJNlLYoS65sDbNCxAVZ1SM/kmyKRrk5nFBMbEivC3gAE18NmLd\nb6HBzF8i1NjqGjGbDOVaSAmh1O90VjP5YE5aVTSI1LcphhAdQvOhnWyLILLw\nKXT0SBjbxMtx0EXX2jxfq+NFY+oYVURmvLeJa0uz4Ehj35owtDM8yI2sORdl\n4R4uvNk9PB1A/HFIpJ4gAEVHJew6nWbTr6rDuliV/KdVRVe3gUersxu2Wnhd\n87Zedb9xV6Js4YwFO63iK03T3UGoTtyZxSSHEiHg5mlPrxVRwtg3330W3dvi\nBe5j7pIP6z8wq0O717u2E2nqNfRvyyaOY+PiC1twgYvAU01pd1lDNq+ZZEUy\nu6WIcMhMCkU7cwG0H9RoeqeXk2cmQ8GGCEKyWmHB14tt2B7t9p23IAmnCImj\nUfXuUEZD3ZnfeBBf4uB8F5UNvbDj2dfexaCkCLyAEJWW3QqrNprv/+jjM3ki\nUKaE5mm1CbXoozPZ3ReBb7gVBWd499P9UXvaRxTvbfGf9UgWzoFwya8brcIh\nOdeN\r\n=1z1g\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICrgQiWyvK3lTCA5aEjtEK6eczZvqIgdKOYuC1pYdDD9AiAcv6VNzTZCGUszCU4I24wZbPCa1cIFIhMasCoOEv596Q=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.13-alpha.1_1583179365714_0.09632500258475796"},"_hasShrinkwrap":false},"0.19.13":{"name":"@react-ssr/nestjs-express","version":"0.19.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.19.13","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"d398a76dfc14860b1170b737aa061d84e0a73d9a","_id":"@react-ssr/nestjs-express@0.19.13","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-C/Jj60zchizPOCGYV8XQNVnz3H1qnFf1ibHswcO1BAjDG1moeML00WoDCV/jaTtpSE+MM1/r/7bryfWDCOZdHA==","shasum":"1b44a2ac64dfb0cc24e5b8cc94680b44e645a44f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.19.13.tgz","fileCount":8,"unpackedSize":16779,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXWcCCRA9TVsSAnZWagAACHcP/0LUO37FzdvuFyWJULAU\ne4gmB5+An+ICauUw3ewH0VTZNcb8tJLDcPPsFiNlpocDExk0k+299W5ns3Rv\n9WS4GOZX2wfu/BaagS6SZY4Hx/kMLls23vc1Y4HxgBZ/TALs1cW6mJRsXO8b\nYCpKssbSe8XM/vgaF+W1mgNulkg8wQWOdvrAvCwnTPAc7kRduCirIjUFNhMF\nAS2RdzAMWhvMlWKSWJKCDK3AvkF6wP7jEjxxd4CB/x5f4FsRfcEUzMfaQH08\nAnI2hk5/TxrVkXsFaqKZ92LxA1l2qYDMByfxkgv+SZTcvqEWn2GXPMkiCy+a\nhjEF8ufNq3gX8h6g8gdTBjGIDcmy9m328i+ZkB3AWp80yUoYOOH9E+giUhj4\nijMl7+mVpJSARI92Z2FKo/wRWt6IBE7lKulaqLlthHE0cgGagwhS4e8E4859\nswwiKJxp6v9lDZmSglTo2xh4QTDt/G1i3AOLAQtpCGpHZ1tcjP0zZF3cWmGv\nie3Z5HU0bZPSr6Vy8YEsVTF6kUgETkDFoP71f1hQ+p0J3GOn2TvwqjI1c7Ey\ni7Jl8NIfRuJITjuNG9pZ3+QaSOiAIRMG94CWdRQTfv0+L0A2JkwMs7evWaUk\nTK80YHFmATXC5Ku5MgkYFo1mc7+syn3ldNJFNVVkdsl1GBTGIy5v3A0fvZfu\nKrFT\r\n=bBvn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICFJMWXKTcw5EapMc1JjyXZx9lsYvKWACxqDo8kP2bpjAiEAmzU7KyuzbPeSFEJ9NicBNoKWNolTtRdhbD8ok5Pf+rU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.19.13_1583179522261_0.8596124412222055"},"_hasShrinkwrap":false},"0.20.0":{"name":"@react-ssr/nestjs-express","version":"0.20.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.20.0","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"c10b3653232bf64179f329b2f9db622e0f8a020e","_id":"@react-ssr/nestjs-express@0.20.0","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-HC+gXaEUEFsB5HdnJ9Uiah0DqhtJsrukZLXlfOoLZIgvA51GJAzHdQZfUuztHDMj0WEVhDpEHu01mlWspPhRUA==","shasum":"f4d102e29f37a906e6f4f6342486809b134953f3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.20.0.tgz","fileCount":8,"unpackedSize":17103,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXW8wCRA9TVsSAnZWagAAUpQP/RP+70hEbDQqeNiZ/5M8\nQkkX9+BaQuqSvpCJBrCvH1s7uvsTOD+JvQte5x/UYJ4f/dcVWeJxTYBnz8GQ\n5WBooia/XQZHfjLYsWzzDoezL+Tgwoo/vVbgAjLnJBIRKaPmAtc8JC1UfPKO\nbgzwP/ScPPDCT8rmebkNfdTFMumHSNfHYRqw9lqzed4viwD/7f/0lcjX8Mhw\n2ApALXVxO0MKpLTluNWOEq7r32WILX4PEA/+gZu42qd/u+ThQdQ4udqrkR1l\nxiNLBYWuva5Kyf7CfzYvH5/oHqGg1aTmv/NL5x7D4RKtHBmHFP2xnKywj2/l\ngpb0GV2F9cq6tQ2zWxgjfYCz+QPB6YySRVybLysDJoEfoEaIq66VJMcQfCF6\nRHjZYytS0ulCDws81dD7x+//YkV0ohMfUa9q9wQAPXxIF0Wgah5K6TkN/JiA\nm/NGKVsPY89Kl/opnQzsZ53BWcwPwRi0Z0vr3fFKBRiIWcMUjKk9OgK9CiDO\nVJW///cQE/aepTVJZ0ra379BUZapwb0G686cmwvN44gD6TQhNJRuuePwqwmm\nmurQh4zvLw/JD/V0GipzKBeYhUMkFg7VKCOg9+U87lQXu4ekQIeaPfHQ0JzG\nO0TgtcLWO/lpGdszoIZfHmUnlFViG+AEV57Z4tfUsvDckG68oEDtwSfolsTP\nFQ9F\r\n=qp29\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFLPcMknHUeEPZa8r7C/WC9Pjac3hDHknaz4LKeus70eAiAQT3ewQTsSUYEkf32fEoeGaJBgg7sDjMQzAClyuIcMZA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.20.0_1583181615825_0.574268093850314"},"_hasShrinkwrap":false},"0.20.1-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.20.1-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.20.1-alpha.1+4e648ba","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"4e648bae9c827145519f03c4d5844cd1b52f5ab4","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.20.1-alpha.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-F/4Uqe9k4hb7Zg8Yd+lxokyHCSZEJi+0ibKF8pL0W2Flov/jZMd54YxdMbjfKAwFV1rLlJbwXRHKzvuDjezQMA==","shasum":"fa102a1f06d80fbdb9cec68f8fcff79fc666afd7","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.20.1-alpha.1.tgz","fileCount":8,"unpackedSize":16580,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaS8FCRA9TVsSAnZWagAACEAP/23taikqLP1YEaK9WsxY\nzYfnGkyrFFxlupR/0cxVbeaqI0kSpZLZ1bY50PoZqCa9iB63Ms6DcG0cWdhT\nSn4ERL3Lhh3gKpzkNeCbEyHHJ0GfdZJYLb8NCxomK3v2I1rY7yybqiULvfo/\nHvDkIp/hM2EWtNTN8iAbUmQ/Dp7PLYXczRXiuyBu5Skv0Ezg9Wbm6TiFby8o\ngByZzaESxYncDovE5r44cDObecPwjCaiObdvPP+s4Iyy+0wN8U1/PzHYhgN4\nNUUyePrt6lZR8sTJsmT1X4q6ZBLfO6Q8aTqJMhUtn0RDP9R+kZozMrOkeuLl\nWxB8zhnqJFeX7rMEu1UWNa+iUDEy08Fpe8gm5/G6432kyfvhAJurKVYjGMKA\nNphh37epKUcf7FCNWNEEVMqwO/Sa4K9QbfWubW9A+NGij6o7Itbn9QNlxzNH\nWIED5QGVrJmemACFyGRNeM0J2tQGZaYLLSIzC+noBO9/TNs4sm46/NcGDF4P\n9tEFrX2/aynKFM+duUZ82V1kyvQYuqI+NmtfhaV57m8epczJvrAc0OJQ5K0E\nl59J37AJBfmw1h9Xbgon/dcpGzfgUrmh4KL4jqPj72z8hJUuCfQEiKPWKfVt\nW6QD+eHzYdo6+qI/413HaSHCMPuSsLk4YuIJzizO7QoRAY3tpBHxUC/DMilN\nIzaa\r\n=yvf4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAsMzLW9w4CqDNSeek0DFjnfFPMa3oZLWN962jxV2/4xAiAusrHBLsyMdaiWCOamvAu4G6DVlHqeBpsprinw+AJGlg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.20.1-alpha.1_1583951620612_0.22205215571229164"},"_hasShrinkwrap":false},"0.20.1-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.20.1-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.20.1-alpha.2+2a4924d","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"2a4924d405b19c5e61496e785273dbf80788b165","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.20.1-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-xVF08wMejIXanIxi5jQtPKybAXyWUUh5JR6RVx4DPJ7l7yBJ1d/6F1eu2Qki/BOI/fzChBpa6GEdhEQPbf58Cg==","shasum":"b79670e74741739d6e597c16fd136569b537c253","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.20.1-alpha.2.tgz","fileCount":8,"unpackedSize":16580,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaS+yCRA9TVsSAnZWagAARkcQAKB3OfWslx7zhoNPTZjx\nMBUrGxOXJHVn2oExrOVupUYAY55vi5MFjgW+gNzThoJd+WA20+8MJQsf8aHc\nRmG8BgTjFxOHhLMlQ+W2xbuKT9NCwoL+oXp+0mSCXQF344DRK95AoVl9bqMl\n8wDCTQ9myH0ieT/yKG0jWT6Aa7bnnDyi+rVn49gwg1E/YG2VGLw6rzDph2ro\nXQFyfB5Ac7mkU/F2xK88U7aHeU4NPqDOoa32jsnylbxRTgnOiF9/Y6fM9A/w\noBSDNfzEKmw7TbAOHxDOsrLJZXXn7uv0qr5Tai9FUegch9J4HCOq2YIRfPJp\n9Iot3On298lWUEdTmZirvHAHIjQL7v6DjBMuMjgXmovYUZEbUS25X/5ajEub\nSTpOWqdayu0Ka6NajHPW9QG6OsAOAar7XelyS2dLcLR6RWBKeT9DWzs7Sf5n\nvsB6hDpv/Gx6BJ8ItMFPe3JMu5t+rOFbge01O3GrLR/8dUJNJTSc/TsaXhDQ\n5DeGV8EbsBD0gyoyUVi2OLbQPjAxtSJU9iuMatiMGjs+q2Ch60zH7lOV51PP\nRy+Qms/QE5EEPHpyyFCNkLnB628hNhFp0kH8xFI9eprzOAyNkqdysZpvJZrv\nItg0J9VVbUw16nlEh5JdDWZLNNzX8O8kcfC+1mwbdNn4fdY/QaDSI/E5zk//\nstrG\r\n=qHRT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGiTB+y+T39xior0lm8fJQVA5CvVH/rZR2wB+43bDTdTAiEAuy0Lj/ron6knNRssFIWzhP1cHpNu74ap6EcE/rSAQTo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.20.1-alpha.2_1583951794029_0.2553876062970688"},"_hasShrinkwrap":false},"0.20.1":{"name":"@react-ssr/nestjs-express","version":"0.20.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.20.1","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"18b4c95afa75a283f8184cba2208c07a4b7a7257","_id":"@react-ssr/nestjs-express@0.20.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-GM8a04T2fpXmY8JjO3nREKvu58iQ+/i/R9qWKOKXoWJMnlswJILsh5eoZRHrdqZHLPH0PpDB9NOA0VF9I6Tiqg==","shasum":"33dda65dc921a365af58476330dc896a8bae4492","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.20.1.tgz","fileCount":8,"unpackedSize":16548,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaTAvCRA9TVsSAnZWagAAryAP/3pBpCk0Mtr5xgxPJKba\nPNwJx0ZEfFG8RK0b919cxeONeaGXbUTVhPXLLJ7Ho20fBV9S6ZU3amgDZYJf\nLC379VAtuNZV3xGXlnC5A2aLgX4FRCcwREiWARiJ9i9WIN6uEJD4yveJQb57\nauc2WM3T/pJ7bvXEVf8yEGPrHy06AfRS2Hgz2eJ67O8JcujOlo0zbc5Wb1H+\neouK7prjO0Gjs387AJIj7gKLHlx4kKgpB92cdOW9o0C2TB3td4b3+dvM3+RE\nBBqjY7BbyrFQUOaA6oVSq5FRyom0cbGcnDTBWDfL2LGoSvwVRPWVj2LJp7Dc\nDLEk2l6PCYwEOySZ+/AEqqeWKr88n4C2wYE3skVorbcBBIFixs9dB11Q2pnf\nDi0yY4WO1kAP/hWq1YsAPUkgDAU28zlml1ReTJwukb8lRT/vnsDrWdTtG6cT\nSfBDh+i2w1sfOMySVa0tI0cu0EuaSEJ+RuC7v9Q+WZ+P2kXMzUlSt686WtZN\nLrzOK+AJx9+FtsDPQL/BrMOAtIqZ82NSo7KTAPTbvivfdYcPT8EIs5Uqvp6G\n5Ao8BPTj2xZDrc7hE9VPdlhpBg7pFhfBuuQPHbftAKWA0ThardwMewB7BK3g\nnugk8bkLNjjeY5oFsj22vBQySBKQ/G2jadkaDypC+v7TRpj1qY2kuU3a1dvz\nStsf\r\n=S/UJ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCa3wTyFddQjnZI2fXccz3XK5as+hIgmAWy2sFPKrbDogIhAJmlYl7URr1xa7KXQb+y88sM9ErBNppKrGhnerjd0ysX"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.20.1_1583951919068_0.2900900032997149"},"_hasShrinkwrap":false},"0.21.1-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.21.1-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.1-alpha.1+c692746","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"c692746a1fdc158e4b3d46220634fd3bd7f96d1a","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.1-alpha.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-d1zYFQ92eJttmChpCa5jnmWd5dOouDcHoc4IQhUSn+98hZW3yxL96ewNS/vrrROKZebfQzMf1S2cSdncYH6diw==","shasum":"4aeb2938604f7df9aab26f78c4342c14d59796cd","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.1-alpha.1.tgz","fileCount":8,"unpackedSize":16580,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaoBFCRA9TVsSAnZWagAAkRcP/1N3ot7KctawpYNMUhpB\nxKyhOhmMEqmN0PA5isoMf21keAtaE5NoZ3m2bXMbQKvcGOcmA2h/F1URIFrU\nG+3EhsSK4wvUUhBc7AEhdAOy+J+HGRRpIBAUQI6HPoaEJhGxDF8a9++nHakj\ndL5f/gKgvayN8GN3Xb4FcntvNHtptHXafb7pkI8jC0lPP2YZPly9TUoB8W/b\nl4Mecp/1SxLdHtLhIydLy8uVH15xctQTsrsFYBOEEz0qtSF+jk7MrJUyya5W\nqhrHJqHpLooinAAiVwIEw38CNYZ31TMwNrjQGf2ceCW5KexOZaU1hYJO6ybv\nfiP/G5ZKsG80w26lhV0cnaRVIyZT3iLOAd0hM6C7zleQsTnT2Tarv96cpuaV\nf1FA6Dvs+rGkdsqHrYs3aTwYAFjpwMtNYLp6j6c5BJti/hmA9qiTiP3X7frX\nXXNde1NZKDR1Lf8E8hOZP5pibc5eGEVC5Ctv0FZFHJsOr6yICbKyEqx36ItZ\nHAP5xjUPz04pkPkCt24mXxsmQncL7zh2gs72Q7AAo+oMb71ODwgg+ts639ZU\nsbtMih4THMEcWFLOyVTWzd0/DXKhAwD+C46Jz6O0AWSvpLNmCp8tXLZtR+B8\n/aAi9/k5ukg0lr27XSzCmER/7jFM3i7hlvZqfnA49XuBhtsk/Hmmxht3ViNT\nkmkj\r\n=cYne\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDjpONWOY4hR2qK+pD4uCQ6GTPDQ9WAkp+KHuxN6+P5DQIhALKjiBADnKf8AllwLH6NkkbblroKgVTr8iz1jMqoovTs"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.1-alpha.1_1584037956401_0.8603811546981845"},"_hasShrinkwrap":false},"0.21.1-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.1-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.1-alpha.2+9c73f7e","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"9c73f7e67944b2750d053429c86d420f24f31cb3","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.1-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-9ZzrWJWKHxA7lTlQpkWvcndFiQrUtkMo+7yD1ZgfmkA0/PrpTuyU9dVj8ggy3k1NKLjvwVRYQd4vbmXz6Rxrxw==","shasum":"e01242aece7cba7237cd851653ba8e3636b22abb","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.1-alpha.2.tgz","fileCount":8,"unpackedSize":16580,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaohmCRA9TVsSAnZWagAAIAIP/R9TbhJguVQsm6jAAMGZ\nkKA1DXz/xE3Lk87u7hW/bMK6mR1LVZVpBjn8Mpcq+4UK87LPZFTNkKeUB5fw\ny7JvAcOPKu7iyV7B6cnPpny49svKwdnuqP9WeQZepyLQA3BNSs8KB9mTUCvX\nO4I91g99dj6O/j0MXEYmmikkTupkjNkjoS+hdlau68a11+KOg8FVe8eNlzFf\nrb8i+wg/sjpdHZ1i7/dp01Cv+IRokzNxJsl2YtMv5YV0D5lKje+YKy5KofFo\nttIu+vNei8XbgNW2qPruUgbRpLUP+Ro7SWXuLSyChV5DDi8iJdld3fh8wSpO\nos8ccCJtr8+5QwB7cDG8neJ+NFgP4VXdbQwIrZKKKwSPo5GSs9p1b/r3IGM5\n5//cOVb040q0VsbF/gpj87WtgzbY7syfuT8EcllMKYl9XsXiD1cImrX3aZ1y\nzp1H4ZJSkI+PJBtNa4jTE6Kr0jd5JON/YPSN3aIIPGzD2LCcV/lMx8kP3AZn\njxI1hwAbUTIHDuBKdBQ8YMx6Jl1+rltsnwV1Bfz+fg+pGawxN3LeaUCCoJdh\nDcU8jvI1OxwG2xdjsuXBWYR7MqrMKLr/wzdR9C1xIeW52ZhTp9q5NOQcnKCr\n/K48vuYg3tWivHyC05tbKUU5c1V1TyCDHx3cffKnHSwsWgaupzTgFwSqRJ/1\nbF0W\r\n=hBlv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG9R91w3hvealEUP6Uc+3q//apspAbCj9cMVWCwA/POyAiAdw8L4DVBngHh8kZq5EZiXRk41z/A4mMZZ3A5xCE8Iiw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.1-alpha.2_1584040038006_0.7251757862786437"},"_hasShrinkwrap":false},"0.21.1-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.21.1-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.1-alpha.3+957c7b8","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"957c7b8979993c27dd1018dc25d3dee0b0bdf587","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.1-alpha.3","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-opEB5Edi19PoyUenklPOx74nCNKDWtoBidDaSkb2b+2D/WkkSSdB/Hg7ihQG4XIy+O3PMb4vlUQYpxhMtX7R2A==","shasum":"ff0a56b81d3e92219e668b5d77cd2d27abdfb900","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.1-alpha.3.tgz","fileCount":8,"unpackedSize":16580,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaopgCRA9TVsSAnZWagAAMAAQAIUFvxoQMfhbavyn2xRC\n81WA6h3CXGmNnhPkWuhDCMQJma68AUrGfjzGF5eIClC+ieIuSQCRo8HiQeir\nyXeWFXNr85eEMQX0V/ko+Sj90647CXJtVqwpjwRqbL8HLF19Y1zOIAbSytGK\nRPN1hdUM1dzuiF+Rd+XO3xf389e6/kqkkDbUTMwMpIJduqmyxZ2A6X4cwua8\n41W2JDxuJk9ZT4of1zfAuNgehJ/PbF5/rkTapPEvLUxPSPhn/95rmII1iXcI\nHOjwTn/SA8gh2n3N9WVK5gjh8teczoPGD9knv8bHABVaCevYw7BmjQ9uE9Mz\nRbAzYuKFaTgIpN/ibYRPv8WpO2yqHcDfqR0jqzigP4uXYz33Rps/Ku9TNdQ/\nNyz97RzNMJXcuLRtQtRnBm/peQUgcpVUsqbC4enz5q6ykwx63a6cw5w2wdfL\n2LjBd53g/tf2/70HJVVGDaSHUB1eKYQoGak9E82NWn2eXjJQsOOP+by5Vb+m\npUsCCELa1hDrM9zF/YNkHgyqTDHl2kRWhsqNzVn31jJy5nZOm4SDF9wJhK21\nR2DS4kMKpsVI08n51aTKB1gXOfFQbD27pS7XeKkMczZPdTC7B8Tq4JDNCPy0\nVLJeLQQCWphA0my94VncQKoeEaHTmSeq2uL1VyqtB5FY0SyHW1nN1n573lhq\njkfM\r\n=Ykhq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDhdInfq1OqbwmCi1sDSejRIjT1TviLVEYbue/2tuGrowIgb0XX7kw+ia4Rn77nRVMlxbok2/cF++AUc2ZzXVEp/nA="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.1-alpha.3_1584040544187_0.21763369652127373"},"_hasShrinkwrap":false},"0.21.1":{"name":"@react-ssr/nestjs-express","version":"0.21.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.1","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"bebaa2d5212784d0644d40db060a328a8eaa0f2f","_id":"@react-ssr/nestjs-express@0.21.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-ivrFyAhNt0imkkITkd8za71io/VEF0nF56GtcKYO2cqi6E0yqzbynhs4PKcVnlgKgNxwAKw7fDn7zNx0YZocxA==","shasum":"92b90b2fe1fad60a904c97284e92867192c68286","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.1.tgz","fileCount":8,"unpackedSize":16548,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaovfCRA9TVsSAnZWagAATEIP/iVwCh/zf+byd/CZwFkI\neVYBbX2XULBPUXIj0T06jwtLiR2DgBz6sKr/RkfzsW7WzpkXJQ6w37hkNTvI\nKIKcQALn8Jc6Br2CQbtqAqO6Zk59mm0KB2RBZoUwN5Mxsm7tZFhSCuoRCCXj\nNKe4GfXCLy7BCUW3Trzn7dNYDZFsCxFkU0P+LRhr2pFcMTuHK34YO0oLtZYi\nGb5HM2Efm91IOgDOfZV2wFzMaUuPgKczbSpjICEaByUxzXqFAxokh3vszpV+\nzYfeW9i4u+DGsAHNz58WW9/GC+rtH5eztsbYUKTWaUkxxf/JzYoIBR7hILRi\n4NV39zxVat0KjlR7rkldOMUlpbXk3bGExhMgBO59yN0sxNnv2ya2BMcsI1v3\nvR85Gzi0TI4n02aEu+JUF3REDM4QS8plFSKjKP1/lrrggIMLFAw0iy+vTqxf\nh8JFExrGaXfCtXrbQQEPkMRVPuRhDnhFV10GA6fJNbGPlQzSkSQxBPpjrhWL\nciOaW1vbbSsuF+i5wGPOS9dKOjNuWF4q4gDF0uaHUuxIllalMFGZRBWvAZpT\nZtSObqKH/Me3lqkCvUy03VU9vcOJYUGocEQ4RFPNSA8RmIHXKgSxbUXY4aFb\nj5MNl8OTYaj6ZBWCR5utTy75KxPaTZupy02X8PC6cbx8S4If+SGc28rYoEBf\n8AvA\r\n=eFIG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCS/EKMhsXXu4cxxrgBMxm1kq3l/SA9z1v7a3/mw/drkgIgcyg+4ClybAI/SxIeW4N3OLhVv6FLGMdOujnfa25/pmE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.1_1584040926969_0.795993397276457"},"_hasShrinkwrap":false},"0.21.2-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.21.2-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.2-alpha.3+db00c75","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"db00c754bd70ad05b4fb9f12459b7f3c8ee46369","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.2-alpha.3","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-H0zx4wQF8KnqRf6ca0IEDA/Nw3XvOpP9DlhhluoPe5T9fzQ3OYJp0z2+cW3m/1glCXxM/vQ/XYHRYXKaN2h3Tg==","shasum":"918e317a4cf4fc1cfd7abc69fbd9b5f9c1cd569c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.2-alpha.3.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeapZECRA9TVsSAnZWagAAWWYP/j+mQ7ZYQJC/66nqxGih\n//6A4bZ50bT1+EzdQLBvq2ufpvBMi20Bvp/eODrGVE/s+xqPhuIRFLJMr1IF\ngvH6WcwMZQm8oSuDrr6SqEKG5TR5Lspu7k46QRKrjnXHiX8x/tBIvqgiELcG\nI6UPVyV5uCD34MXi5rNLon/rDTWbRyibRdPqUaWC3mTqpZGmduOQ0efLORfd\nYPavfoPBIZG2YervjElcHZSDyKqyRQPK+gF1+R9YXlhLmMNc+bI0khLyvGOs\nnicesLDD+PdXIhXc/RFF9kJydhNDxJMgzzf2LKSg1FoDJFiPz8uvCpozCyot\nt+zXqucnDHmqOIjnYDX3/THZlMgsDZAxhkPVIl1L+9a+G+CmOH97YQh2IRoH\notPeWaqiYLL/SRLKPSUTlIIqwSBXhd8lCLxs0BAahR4mXLN82hvpDRfdrzZR\nKhugiOCT4X9q1ObNLwcnhncA76hja1dy9kNppoyUoZKBQYbpITtIQlEq8Nd/\nwgxcyhs3SALCtUY3sDAoWe34JjZbDSbI9Vp6NzzIHwlB8dnyiAGp0R1bY6Nu\nLG6ByJci9v0F5EmWFlKwVUTvcGBOrRT65vNz4k4zmK9PH6cJ1zdhzQN0y4i3\nh299ZJbH6f60haaf7g2V2UDuHZNQ1xLQNYQDZX6Nrx9F9Y8YhVmoEACYhgS7\nby48\r\n=eM+U\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDTU1slEavhc4dcC7d3wtckrKl0nkulRlC3mB3+emiVBAIgDr3NqYBfxJSXwNjY1Run0U6B1DMu6tpP4rdBSahRnNk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.2-alpha.3_1584043588163_0.07050983896419805"},"_hasShrinkwrap":false},"0.21.2-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.21.2-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.2-alpha.4+6ec5349","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"6ec534960c970cd2fbd657e09f72d4ddcfaaae95","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.2-alpha.4","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-Dk9lpzB+GA7Jf5tY3f7r9NLfdqtQjXLn4jPr2xuAUFS78rRLtROp71CHBFIHzAecBmerg4miOKpAMv5zvk214g==","shasum":"a9b06d741b1e16e200cce7d11d5fd728cfa5351c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.2-alpha.4.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeapfyCRA9TVsSAnZWagAAeG0P/3HhCSrHokSw42eSmfUs\nfPrIaLom8GyatTrJwt725KexYzaFD3RycxUUVgulr96l6z+mZnZCs9aIWc+R\nMQAFKc3g0HYE5DNiuv/xEnOQdkl8RsRs/Q/EuuNtco4JmKqnnzZMftQGKE42\nWOqw9zwmafOjRMG8+Y4x0Cy1giIHIHBgPL8PfS12tNccdc33xwpEZiRNuIqd\no0T9va2aBC1O2iMHLrG2SyL4ncQ2lCXUuwwun1COSfPvaGf76h88AI4Y60mK\nHh4wEqabkPOJygm4tFJnlF0UWJKgOCoahj+wlew+bac60nyuxFjWQU/RGzpO\nW4j30mvaINFYAjSCBLOCot8lAk4g75BULz9IwvBH7sml3zpivRuUPbnGnqIN\nWagD5S72oGbdbImFjVhxfAnWTR6CTPP+SK/T2Eri5VTbCvA5dN1mKhOgGHIX\ngtXAJ4FO2/P01KdGfN4DCVMpKk3yiNbTSblLubn9g4or9Sv8VGpxethN2Xr9\njqdZHp9aU85pzMBFpj6u6i807rLylfFSQqxsAdXCAb1QlXZoTL75bu0TzT6A\ngoIV3mJOLBljEebfjGUMit+Zw1He1i3UGqqidarzUSHgBtBoYt2sNgYUAR8d\n3IR+ar0+rS5Ft8O+FA5DGitiZWA0eEOHRIU9r0ukk7lUsZ43//LGAZ29ouKT\nszYF\r\n=g4TZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFg3krsKiKYGOi4Odxi2CHMvaDJ6mES3KxGMNqzB6WS1AiBaveGeguk1KK/brNa0H7U5JYvoR9AMPk1ttoADFR21gQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.2-alpha.4_1584044016824_0.9123486088305486"},"_hasShrinkwrap":false},"0.21.2-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.21.2-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.2-alpha.6+6205f20","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"6205f203c6e214d851f8263b1dd10327c70da700","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.2-alpha.6","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-7CypReliY5E61Yv5NRzzre9mJ8JBX8YFQspn3FBjqkeiFO4PuL3+/woxk1uvy4rC4o4zQ1B6kw5ykbfFCZTUCw==","shasum":"af0704c7b27566ef2c0e5d7385a4d226eff69a0e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.2-alpha.6.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqBnCRA9TVsSAnZWagAAfQ8P/3JwOryBlF4+/Kcn7Bjq\nSWhyRYMngO5vKHE9MviJRphWyYr2TqClosWvQzSKpWTGGDPbQ0aep8OW8R1d\n+nJdlZZjs5y18uuKEnUXRayAGH7tVaOfkMFcTTCr/QDuydCja9PvEYT7WzmK\num13j5KwIkwgd7ASY0sfsKn/iaMOdRX+hMVfi5BDS/ZZDEe/DrC8OFQLxYbp\nr6pv31rLSdzfd7ZASxzpwL6nmcNRATfAFyQGHepQOvQoQcJYss1rrBWiNVHj\n/jGDGvIHnKgRjcnpotR7/CnpS8kNzUSbK65S3U13vAIfKxx9i+fjZNcFAoVw\n8TbuLSJkG98WJ9nkukaqkuIpSeWd4b1Okcu9qk2oj6BhxhRtGA62nQur8T52\nMbq7BL5S66u6c3l/R2v9USCoRzHOMMihFM1quTZwBotJ4GIintJWxLPNKQ/b\nW29UvT1O2e1DGx0kQfNMq0de0bOxcCtl5tHr8WnTBw+zTTviVuGFqhhdWBVH\nbz2B/8VxC74JL0fHKXhlDY0Ieo0cEtNLKCBH2w4hVd4zwMi0yGELu9r20nVZ\nGmcwrd1h52iX7b+xkAgP97A6fAVawAZu+B7yUPjyIpqOpqAIvPhgr3S9yXy/\nRqNvjfCsqtmfjXAFzwyQNFH7fGy7+spMtQks9W0kSWMf8BQEDvMIj5FN/kXE\nVydx\r\n=BjA4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDzHV3jsQ/pNQ57rtWM/144cQQJA7KYtA1qPhPdCzfjRAiBpKq7LPVDQ1ORP0WZJe2MhrdzPmyqaWoVoYq+i3qxErg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.2-alpha.6_1584046183003_0.9886017668492262"},"_hasShrinkwrap":false},"0.21.2-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.21.2-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.2-alpha.7+32e6c70","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"32e6c7050ae4fa9d06e4154569ef8ca7638604d0","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.2-alpha.7","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-uclyZ7HAh/1axTfU49SLGqImqe/MbmX7b4K3gXgGjrWCtgyMHv4J8zsJNc4S0GyrToWcKz8Z791x5Hh0njJviw==","shasum":"e4a7ab18988ad41a7f609b85f17e5745b0eb969c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.2-alpha.7.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqGHCRA9TVsSAnZWagAADvsP/j6OBIEyzpmxoFkElR79\nACSbEvVJ7koG8NkGLkrF6ADXLBMwjhWrtzoYRt1brkym/ZrPgwT2BXTFB+ni\nOxHvwVCYwz59YU15lZIRg2Z0SkgzhgGprpHnT58/+IhKjkaAa4VqYuGbcXnT\n46IaOjnWMSkGdCkXHMhLq05Ap1IaA2hXwK3LzZzf8JT6LmW07jxrL8VbiDan\nYJpUzl8X+70PSVlAW7+2uyqWhH1Id+XOGrelb0lOpQ3xHfsh2TeWNM4G+Cty\nBtvD1urJYkqOZ0N5kWlircESvb53rL4oRdUTKVNbxEjjaBAJ4VZLreaZJOsD\nUfNAAbwFaGt3cOGu2LWtUoz8MYrx2bqxoiKEEM/ys8BKFIdt8b+33dCnefcN\nBmJXXhjWkm7zGIFYATp4l0XGKjrstlb9mLRDOXOAFNkoTo7RQfZ3x/F5VDjj\nbixezimcNgYtTGczifXtz0cQiGAt9+uYclFgUke90Xb+df11+qI44o1MPPiF\nm1tLHo6L4jHddepefPY5dUspsWoJoa7MGLh5sdKGrOhiPhaL0qpOJMQCU5pD\nE56XaQ45yMMBbYAgKAtX+vq78HrYkE/JuivU8dI7Px6T+8cbE3o0GarJPlra\nO5hXEG831NelVLbSZLO9F1eGZvni/3443p/4sbRAnqIKIiJVATgzLvBrQIT0\nOIXi\r\n=b8Ii\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDf1g95n5PRQVxufS+MMcsdDqYfOcR7yq+44Tbvu9DXDAiEA0XhPe/p10W96y0jSzZPqz6twKRLxkW3FqrVzW8GnXCE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.2-alpha.7_1584046471239_0.4060577485883139"},"_hasShrinkwrap":false},"0.21.2":{"name":"@react-ssr/nestjs-express","version":"0.21.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.2","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"a9617070a4e6f502178fe8a81a9add4b88299459","_id":"@react-ssr/nestjs-express@0.21.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-dSatNH53DQ2088872wH1rnBEjTkDL5qztDoI2HZEySeolXxevMEWQ1wG7y1vP7y6FnWmF1rTLDLXcWYvvzmlIA==","shasum":"392d9c8d9e9bd5e9551172b027cf602af0769518","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.2.tgz","fileCount":8,"unpackedSize":16663,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqN9CRA9TVsSAnZWagAAWUMP/1atvw4Z99tH5DQ9UVlF\ntmV8RENNFTrmDaHVITD3XydOvmklem8cL5pV2Sn0e61n9NfhiDdGr9G2URlE\nPiAhttB9KzOetMtTXvNrFEK9eqZHgvOusAm/1F19I5OIuR9u5LajCiFIsKTW\nVoVY39MFnQ2KoGYTu089skzwztkcNvQHjDGHfFEE/+1NvERRekNwMx2I4hfx\nFe7rl+IlPr9eMrA/ZYUrC6deJhSYoILg4hSS/w2YzsLjOty6FRzFyJyGqRrl\nyUZjf4jyrjFOqloKIC9PDYUka96Ni4L0QYvApV8Z6vcUlGIkfqTKCc5YZDAa\nM0JsFQz7F5n0D4x+8GYuJBTa5ocXlzW/0me0EeIypwK78Aq9q28/QedcDdxb\naQjQgFsXo1bzCWYHj/tZIldf4BEkeIPXhiBvay5aNLkvm+vVCVng8kXMwtit\nqKeKGFJzsQUDZJ1kRBUFtu4cjip1UnHiGjkijOw4rpSKiskpIoJwxjaHfFe3\nHr/FCucwHnkUn6ozRrLOkHSbznTHq/9jb37e6dLPkKc00RsFxxyVFWDHn/0N\n7Gc64l7wW86D2snBbzHnle/A4526FFbTcRtxdmhyYlZ3T9MEHS7F3JlLVQ8y\nhJ2vM3STYnapBJmPm4OTu8UxcF1xnTqegUFz4A1AUvnxQjOCZJQw8/UzyTeH\nOdub\r\n=HSWI\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDYjbngqxDFTLIP+qWK17BHkexA/HhQE8DOx2zs5ySE/gIgBV02MJFaCOU9911q8rgpMP21o4aEABr8ce/qJOWVzwU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.2_1584046972724_0.2958748291440265"},"_hasShrinkwrap":false},"0.21.3-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.21.3-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.3-alpha.0+1eead26","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"1eead2671cbfb9ab74f75c602e40fd0484be8c69","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.3-alpha.0","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-M4HZxB0VucQe9jtdBZ8b47MagINtxuY2BbIHJnIonw0R2cXQ2Cb7EgD9RvB2DHDYXIp6xYK3rMlqY4iN+8sWkA==","shasum":"9eefe6cf52231fc9bfd4d9cd78df1a9d265ef33b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.3-alpha.0.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqcMCRA9TVsSAnZWagAAVWsQAJ3JSzI4Txeh1JbuDrdk\n5GhkZUJvjY0uPkqBT3BTNuGYPuCgSpaVXaW9tCh0v+tPdHqg7GGUDz4PvNId\nwMqiMlGKU7CHvYabWyEBzevXgZKoIwQVdji1Q7Z6QPlDCdfmRcdgTYV4YcOx\nJ3FGYOPe5nTaGZMMNx6fIFUuKjq0dA/VMaJeVMlUEiHsrXP7LCq2ZpnM0v+A\nvDn+uEp12WJPIHs/jOUuFVUNmKvMcqVEiETZH75afzkXMs73Jr5R6H82MV39\nIzhiurGWMElu6tYE6u3WscyVArwTjHSoZOfu/TpBAe3YzUbkJYa8MDXQMI5h\nFfUKUZDWfFOTQ729/rc8QwsCesVB5k+ePTL5zapFn2l60IIgVcS1Fa/lPll7\nl0sCI2gNkhktNnfy7XZ3fNJnPKi37fg1Bthg164q9tmuGnUpUPl8vKWJIiyU\nis92uafSuXUaeR8F4948GT/FpvLO60RAch3A8GuVA7EcIQ11e+87+1n2k6jX\nuHgcGxeKYzUP1brlf9zNl9h0vXZQV8rXUtJLu03+T7BV5lF1Ucq1W7NSPs0I\n8SFDtI4wJIkaL4wxMlDMFLBr6DU9PEmIBqQtan9UYtsknweP21y1CKHcG4D1\na8eseaUHAW2vq4+2DUKrXiTfWoKMFNJ2qsvluhNO7c9e4UbwBuOAkx1tReo7\nE+zf\r\n=9BX1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDPAwSc7jljP6FeUs1iecXv4CTouNBcdkZLPRDRvBZGBAiEAwzUvl8d8wiWEErX+XCmxYBa1BzSgpTRLNQFl2iuhamc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.3-alpha.0_1584047883632_0.7982053430449063"},"_hasShrinkwrap":false},"0.21.3-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.21.3-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.3-alpha.1+6da2718","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"6da2718b3608751d80beb24d515fd4b38d3ee066","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.3-alpha.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-VRAhbx4a7cfv1V/VMxb4J5VS03TvHf4I4xfUe2gOrIzN1swt7HAG5oJYHSfBLYSlf3lWFlwkJL2x09ZHLG2J6Q==","shasum":"c9b40f30a183e5867116507a70b7aa75113fccfa","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.3-alpha.1.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqddCRA9TVsSAnZWagAAX+8P/RHyys5HedwxriqtcOz2\nVdEcXv1zsIVleS0fbDpYb8odT8/CYhGhbtqyCdkUQovGDaWwsjgQZH4xWX8s\nSjii51UNZjDUwDYpRCQ/mqyZiWVEcgI8N8JZCNfl3tA39t0mCRf8ddUF8CZT\nRWHaVJ7sMKG9EPK8pKFjE/dxJ8shL2XxLehGA2TIYLrq/yms13BkZddRYA4u\nWIthpW6MyzCs0LUUnvEjb9sjUGf4zcveE1tOHqiYiQ1zZMIysEf5xCIp5s5v\n0gLBlqzwZV8r0OIDNJekg97YjYn3v3UHEMhQyTfT6uOL9AdBYLiqo43mg0T8\nuTX7paFcbOsq15vzknYzpbLknW1EzigADUNi191w5uVlACAr5UyHK471uH3e\n+IdtVCGF+HrivYrcjx6ZKeBwnVfiksKf29p1V9j5SHnz+ehSVB2ZCxzO3X5C\nvIHrvL9Qv1ruJwn5qX6Htq1IAGLo0EjSEwx8GJMYSwZ2bh7Nkt4qXVZu3et/\ntmDeILlvnQLOge7WuwtkJBllShNl9zkogCUqfirq6eVl5b9cQzy2gMrKz90E\nU7MKmNPz3Jv1SYNd16tBiJr9B/LXh+uyfN5j3V23WsSWoIE6KrYxFYc6ucSh\n7ggdZ844NlfK0YfaIKfETCSnAPNXMOfbdqreqI+GmneEmRr/cBzsksqY4Tp6\ntE/N\r\n=3tjB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIArW8KuyL1v9AJA6+oiG9D7vW8OYtkUWtSarOIEWVcKjAiEA0NOxjTGM1Mm74x9pzHeJ6lhXJ5BBi9ZD3NAzQ5vicQU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.3-alpha.1_1584047964551_0.4974592420020303"},"_hasShrinkwrap":false},"0.21.3-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.3-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.3-alpha.2+b87e29d","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"b87e29d0ce04892d2379d19be36b3480e82ba0a1","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.3-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-Y3ZwHxfU/9Cwj4Jn93tghlrfQFOALU4mMo+qt8UC/6mlyJMwEYaTkUe1fcpcWbDn+kFdOiSHbIruL6XzYNKG8g==","shasum":"c42cec964275f43f7f588cf4839e36667a4d131d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.3-alpha.2.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqhqCRA9TVsSAnZWagAA5rMQAJuau4ZEmHrzVGTVkY6Q\nh8LU9krJqd5UGKMwt4QkBa8P9bK5RCxi8qTibAMdasVPPhPCBELO0OTiS9LO\n1NBwZlseDalvotFR62fq8fVj9NOSDiIlJBCMrGI7oJ5Q9nE47IaxfmUQDqq6\nrAqy+N1WfivhL/nhzXjPXYitJF8W81XifcCZMLJ8CNQHjGXUEhqXxFhNa0r2\ntHkOZQjTpN4u2FVB7zR9mtmMrNqgn1wfTZzYWHeQ36izQzhzKGGtwjPKnaNJ\nAv0I2bJQwyPn7Ju+M4D4/EUukgYz7lOPvIgBgJa670XWP1OYokdNcnX1QFOw\nizh2yuLt8gS/E/GR1+JTLHw8jTtMnCk+cNgPNWplqo2fDjgOum55oRYHBWWG\n7u2txLCW/PK7iutOpG6SdTA7KuV4ZqU/qmjRkNj6hYZHQnjCWP5jm8XV7368\n1PzBVmWZ6/K4Xpx+NPDXilRUnZPsa1KO2L+ORDczKNMjYKD9JDB0N6bKCkvT\nFizmZflpce3NciptwRUihtpLX2n/whIMbhcXTRQdHICpxK5rEfn70K4LoM/C\nNUict7Toy8u21t6Wj5E4MNLAWmI/YTkCXe1YiLtdD3BPJf/XBZMfOtle4RmP\n0ffvgVK5rI2pu78XZg/o3sUJ07U9OfCBXJMatAyt6590a1gVAyl32FtWaJnl\n3LvB\r\n=GqpZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCm5oGaEB3Rxp8n0VLrqQSGz0pNyOihLN+psJHJ66oiBQIgflPHmrom/QKgaT/8xTjbIoBP7hoz2UefyK1FiBalVSw="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.3-alpha.2_1584048233560_0.48598664350031195"},"_hasShrinkwrap":false},"0.21.3-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.21.3-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.3-alpha.3+be4a84b","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"be4a84b9de6322cff41b8f23bacd3e8eb5f6ca30","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.3-alpha.3","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-NrWVqymOX/lgp5a3/DrOYIMTrFw+e1HIukDrkaJ0BsAZvvno7rrKbFeAVfNgZGOOH7K5d0o6BuQouYFAVkg/dg==","shasum":"768d958ddddb5f9d6f9fe95ddbe5a3870dceda6c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.3-alpha.3.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqkxCRA9TVsSAnZWagAAvYMP/jfKTkdHRDEEiiFNOJ+m\nNP137bwraTV1dsAHkkrkm0ZOF0pvHc1DXtIEO4soEm5yp9N+qHWhi6uHI1bt\ni+ZzNUKOcgSHhR7M0GPnlI5O25zJM2wM8xEe8tyvvTb3F7SCV2WjWwDxEb0m\nvQPOMpAX+hBINCM5v2xfUtjd5xIPSTUQOgpuEUfhAsynwsr3eq2BfiRar1Mf\njI6inDjvcgMtlAohFAbntyqYyHMjC2G/0+TJWPUv4QRQHVU4gHRCBK/dOnyt\nNEJMbvdyULNbeyBb//mUzBZqpvhXr3Hjt/fXgidxJfrfzD/65O//EtMw9ysT\ng009M7mtM4oD2xXYmyzaKziHYHNV1I49ZwgLQvTq2eKV3GsDhoiHKabP2vlU\nWCCYPuN9x2HHmUW1x8DeT76pbVDpr/ZabetgChJC4IIZJQSa1XDIAwcg2M2t\nNcIk1mIQ7pZDZa1EDOLu6iRg2q53lyePNdWC2AmY+LxAw1J/WOGbEsUb3Zdg\nN4nTQYObYVK8G/l6+ElinuAg12ndMgvECLVuSuBzXxNacFYkALTebFJo4YOn\nKY7CsG0L5KMabPKDHhWIuBjbM9c8DYYS5S20as5bBDxYOVVx5DgRCVluOk93\nG0AlhMmupVjL+ETi9zh608cIbx1/9sC4FztXIkzWuSS3F7k3DDDuE7t9E5wT\nrDt8\r\n=+xUg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBuHnhknWyZx+6il8x60NHUAMPAdWWWl8HjTnjRwKd5YAiBXz9n2TLhXDSt1Pscd4lnsnSmuMe5rEnh0guffF/Jv+Q=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.3-alpha.3_1584048432639_0.5143737742176491"},"_hasShrinkwrap":false},"0.21.3-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.21.3-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.3-alpha.4+64d2dbc","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"64d2dbc1d43be4522f6827ad3d4377f404bd3a5f","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.3-alpha.4","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-Y+XBzj+scfF3DLBgcDngILMu+OX54If/zedqC02SwblmxVUxMC4veGYH/q0p81RSjLNbvJUDNSH6n1YWu1Bczg==","shasum":"306bbb783925b8251f7ac14cab8fb7614beb2cff","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.3-alpha.4.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqqHCRA9TVsSAnZWagAA/T4P+wSFbuIpGSvb6hZp5AE/\nmHDRg6ULhCQ+Pbz3RlArxTz1HHG0ZapU9sHxeimhyRcNBtDNnqBEDtYU8xO2\niHrJDwLAApksBmOqS1YR0QZpGYoUPgSa9kcdPOQgB4r0ZlnEMtMtTDrKKCI6\nXPhsrx8+HuwloZGz7t1HqihuakNOHyNbN9AWDD0On0wO7W7A080fakzVX4cu\nx/ao0m8A30erq/0FW2QTIAC4GCo8PNkrofg22RwUpQK5s2G1+rolFDSQxBG1\nFhVyyXjkmj09hKv93uayH81dD55p4svehXiVnUZQkJJRl/SleDanUijGD6M3\nNmuTQDJGbsOx7XpQtpjb19TWAO8/rqA369gEDqCt74krbM91lpo8Ydu00w2M\nv7cpUtSlnAUEusODkmL84afalWY0Yy/BVco1aFT+9wUlMh3I3TKk7S0zpQBK\n15WwPZLDOBU76S5C+zrWxoHqgP+tFYMXmF2ofTj3aCYfkKcN73ZRz2/EjTPw\nQXfXUirN1cR4YAq1KWwX/4ZUnGv4/kXuaU1Cw3n9W79EPbIHW454lKF1BKqw\nZMahvpKZqUrFEX5yOmcVt6zdzbEtoO0OdxuFEcTSoA3lTa9CM2z5J8KU791W\nVENM/pJO4GvynU26JFNER4QlXduU8P7jWXUN4F8fp84PW2ItenY8BUIMIaiP\nxB6E\r\n=nOPs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCt8L8KwknTDh2R1rxkJ1Cr2gZxf//MtfVRLT4COMYCOQIgNBtjv8ottQ57zcsdTLGTmKOHKDJC5r1Pr2CblPyrcQk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.3-alpha.4_1584048775056_0.3349955745539921"},"_hasShrinkwrap":false},"0.21.3-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.21.3-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.3-alpha.5+df8b579","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"df8b57937b45c783de2e5e11bcb190b842f405f8","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.3-alpha.5","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-r6HBgoxhbuClVuQeiXm/BIikXEbi4CF5jzoAjQUge0tQvrFdc/xFg81/dvbRq9AiobI2Fjm2gf6OKO6Wu3De/Q==","shasum":"67cc1dda0d8e05582406520815be25dc6bab8628","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.3-alpha.5.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqtZCRA9TVsSAnZWagAAxmYQAKHHQVLiQSBDaga5OwXL\n1Vtx6YdskQmMD8hNDuwYNhzaBoHNBCHEa5xFOlLSo5ORkfrZHj+iHS8r4uEs\naC8dlvS4cFhNU3z9m28iFXFqDNeKcwOKZXYf6fI1LEdjKqMaTSioRk5mVT3F\nsClrzk2WQkiR40ojBULB4kZtxbkK/1oO9Y7TlYGvCa0cXj7zXA6XXrB8MIaS\nP68cVLckh2QIoLLYKdf0sUyEoTaaTVaBegZuMW9YFua0Vy9Dr+vF8RPVMqyk\nxd4A/RQsb8ls6N03KGSSEruetyizyK4k56A3cIfsvSq2+RB4wkqraBSM52Jv\njQcA+JU67gPY3znlzhZWqkANdlimS9gJ7V5q9KuHETww9CK6d4nOTAebj15M\nFJiMmlBzCg5deoRoX6cvqguPbjZrJ+xSwTw+zof8PTZt+k+C6E3ThnBSvm51\nI79rkDH4JjyuaVD8+KqVgv16xhyv4UTNgrcXQJXTg4kna5BiaXaNggoIh5Nu\n6WT/zB7Yzy/G5t+hzlgQtx/vYtuzCXrLfIv+U7J3BaEy0jzrr8mYdfcvgRF5\nNOJw1rn55zIL/3OZiowxkMhW+hcEhb/XlsdssmoX0oa7GM4GWqHAUcW44uQi\nFe+mN6I5EHp0ucfgC6MRPq631LlECTLfgcDL78HigwAygE4sgiU/IoA+GWVL\nJ0w0\r\n=jp8b\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDXerA5qTJmMQbXrLXRWpNxQXs9lfjnTaT8O89vELHmFwIhAOGNWMesDNcLCOhHZEN8PTUinL9i9hAekacEK9QNn13B"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.3-alpha.5_1584048984928_0.6207274610234084"},"_hasShrinkwrap":false},"0.21.3-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.21.3-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.3-alpha.6+7f35c36","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"7f35c36b39b29ea8596613399971aaf7b39b31fb","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.3-alpha.6","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-0em8WGqtmmGfso9bj4KAmYOgKO3U1FsUDdihSRBdQ5vQGBfEQeqQBtOxS8/VqNpTWbM2QLCKutGH69bHJOAljg==","shasum":"d564c6d5cf874da26007e03073893004301968ad","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.3-alpha.6.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqvZCRA9TVsSAnZWagAAsbYQAJ2QmuHx0ZY1pXTtF2b8\njFrHOAadheGnsAXo6+n7QGF0kypbSbpFhnUw8vFakozNwdMCsElvImkc6yvX\nUJLpov+1a1vkV+nuAZHsGu3iYnbekr1K3vaHbjU387NoiMrN3k0EaB//hKiX\nzJgIAqz9+XkYj2sZ+1RgySLrV787hiSMiC/qht19Z4kiiJJWML+ojURVU67u\nSQrxTkUJBYl9FcCBpdKJiyE4NMOxGrJoUW/pp+Z22P7WsrSMqDo0kqaH6eBJ\njEjTXH6AMih/v8jyLEkWVO/NGA/sOK14q3Jme3g377vLGLXSTMEdkWHlvHJv\nRbN/hfgCPdAoiVgrAmTjI2Of5xUwJ2NmkyzwRpMW9lAK+4QEbjzSQPUnnmL6\n4JvIZSUYPvzTZW1zrPE7Odij92+bZRn7XLts/fyyy1f8t+EHAl7pSprkzxnd\nXAMxeTxMcECMbPVZ23BANtRoGpMvRiDJ22ZBsAQMwm1PghBZrEs8ch47cYyS\nJTkwrm0wYQMWWzxp6gH+LTvKrtlBrAH0HPLiIlUXLZ3mmHhh+3q6hSGNAkbD\nEiQ8lg5pk9kByrm0kQ8yK/V+xbrI35YrXQHlQ4vRnGD5GTydYTE5t9MRBgHF\nUxBIzlUMgSIQeFUWjjyDR3+yHPA2/qliHrcCwrQQlT7fVg8dCr3Hb3vuOcig\nywhg\r\n=C+VU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDREVr0wWxJ0kHqczFrWcXVhv1nCMWVM32s1o+Rm3AndgIgGXt3wqF7lnZ0fstswOHFKULRA7+LvThQ8lrMUcWa4EI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.3-alpha.6_1584049112582_0.9787014894897736"},"_hasShrinkwrap":false},"0.21.3-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.21.3-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.3-alpha.7+b36c022","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"b36c02204fc380e10ebd8c0a60ee7394009efd44","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.3-alpha.7","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-+s1nVTNfs5+r747UhHuLC61dF+q55SsL0uB31ewGmUDD9aaaCVv+KYOWBI25I3zeZybWnVqTBKR3+nj5N1eJxw==","shasum":"8a307237ae57446ffa66e48e51d3ced292772b8b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.3-alpha.7.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqxyCRA9TVsSAnZWagAAxbwP/01SkVWvckWugskhxCNO\nr0uwtUvSYSoYbb4sgA+gxfbAU1sbrkP4eeA0kVIr3GPimJq6CfwEkfejUocK\ntEMj9EWKWuV1zQt0CqtR8NGUIQRAJN0d4477rZw6HAcUGEtp3HDBYFtWIs2/\nruN4Chw4H+FL9Tm50Wf3e9bMxoQPY1J4uoFSTqVG62oXkf9FZm+36Lpoblzx\n05SjFwZX0isaGlQ7sJDxyngboYLQo7qDvLuyZibbMzoIedEksCNEmiy/lPb1\nuP1DGKpA+igItrT9VyBKFXSfOwvisjjsCfhPNsGsKvzcOopsanVSzejkhwKH\ntWuQGSnoTn90QqmMPJWtmJHbYGgtfC7HlJmMCSLe8mtTTmqjCkgC3Z/JlYIu\nuMlxoG7Bli/5naOxUjHgWAHEX0IVAqsJ2LdJ6i+IAWVs9iTBRLCbctvaSjSH\nThnckXDDocWPDpsUIoAxOCuO3JGZ5WbwRR0akdLR9xdKQ5piojIBjB4+9fYp\nedaWcpl5n2Ifawr2ZY+udwARJea9MJlNqxGv/v0PW/cbM135Khq/VX1xI4VO\ntJfaR2OkGEuUqjS0WbaDogWOUE1imL9/gDnAS51EY+fks9IQllt47E3awR5h\nhdzphx/LeusI4HBpCgYeDPSvRXOEr7AtM7f3KuERQSMRel8PBeclATg39qK8\n3pDw\r\n=Smhv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDkcHtsOd1FMyp96lllKUXEnXQ15K9LXKcwBz16FYIidgIgS4zyRS8uyi6WmarjNmOdrEA8+a29UsXidUjyOysp7qo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.3-alpha.7_1584049266221_0.9707495122061742"},"_hasShrinkwrap":false},"0.21.3":{"name":"@react-ssr/nestjs-express","version":"0.21.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.3","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"49ef54e33f0c2954cfbde2187defe5e1261b744e","_id":"@react-ssr/nestjs-express@0.21.3","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-v0UCAU10ckWfvfwQnN9zdmcqRSjTAryFa1XuvTwYTS3MJfMXnQnv/YphJbwGEoDLd49MGX73Ip/rKKSpvDQq+A==","shasum":"bda2ac17a5a510fb8fbdec958c5a15397ced9964","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.3.tgz","fileCount":8,"unpackedSize":16663,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeaqz9CRA9TVsSAnZWagAA3loP/1PER762GnWNkvd2HQir\nRBV0wFKSCd9vsLgA7LL/3k1gZiEq2ue1cA/EjX9tJ3k+bdEZZJOaxo7QQjj6\nOJSWNLo/cmHA6NvIdSP8sBDtrXMMolvXuiKEIDUR4HdtZBI6FDuOrx/G6GZ/\nIs+euw2M4Nxk7Aj4gAivH+sE3PJik5e9yd9DCxIk/+mfNKZHIitFNtuS8+zs\nfhnO3zC4zJcjTJgl9BNc9Sq6raetMGfK4Qi+cbaQ+c12SPCUATY1wGCofcU0\np8uoiJqyroueI/rBJya2Xl3EV29mSASxg3xyDeHPm0/V2Rd8w0Gi907H0q6V\n+OeDClb9qzPJqU2zeyp96RcTF/3CqNTTcb0ocWwZPQ8WoBvaLhc5+eBTFSpD\nGKEaPXEu1ndaif7MbYY0sT+pX5JD1LJTq2cHkrcIQW/dRz0WrlFXo+YJq7tS\n7y1/n0+LJtk31u+GawTnXJM1v8Sn32MaeSTfh25bHxml12NM79i5AFrfCyDD\nQVnm7JhHtF7YD0bNRYollbbpc+6WTt2tAzjDxCo4nd9+jBc0VAG3qAcG0k1f\nRF4QsV7u+Q/bweOIs8QdiSL724vjNfXWaAEFMBB2aHOUe4qLF854uOftzMS9\nW2ipBDh5AukGBz+tVzMyXIz8Pp4zaoJKFq3dTB/OKZmOliRTXBK2szH9nZMu\nKVX7\r\n=YL5j\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC2xifFugciFuQgVs78O425WQ1HN41Tp2tvGL0FMulaEgIgQhGt50Rf8SG7/yEyWXLdkcAHVQeeKR1ScP4rk2wCLt0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.3_1584049404326_0.2326963291853581"},"_hasShrinkwrap":false},"0.21.4-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.21.4-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.4-alpha.3+af8e47e","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"af8e47eacb6365014c7aa933ed93a8b9a7dded31","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.4-alpha.3","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-1hi4wQcZ3R/UZxC5BosLUWoKpZVi/ZygEAoOUz594WnF5jUY5TWVNEoNTImWpkc5MjFGrokixkoIarbRHAIQbw==","shasum":"1ff7090c71ae5c2b994f8833c396d6d791cf00be","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.4-alpha.3.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8NwCRA9TVsSAnZWagAA6E4P/3AR1D2n5S+1b9Up9Ao+\nTpKLKv2GbgTOEfRM9735JmcvXxYlM7zQ3eFFTebJwD3PRSElkOy+bwY7vY9e\nE5UWZby5mOXS6A4ma371fhuZPWqTYzHhwzaxsavk5t2qsc8Y8shrIMDY3BhU\nj+OppfYqUsEUG9pLalgO90Uv/VFASrfxWDOSHGWvkz7YL6xjGHDqlgt0EGN2\nyKGp4Bp7ySoeZuH6YobmRvleSh5gHpEExz1mz5gMFNirif17tAPhRY3fdQY0\nEJ0wXgSIFTZTChCffz3HThoWpulHzwZHtakh6STIrHUmTWre+gGgCIBP7q7m\nqJe3Agbh+fA/6mqHwp0Tcux0h8YiFCcL/LnJrMCjb5rCksx6DkdeLxviN9DM\nSfaNU9geSgDJg10TUecEqvtLRG0pZfI5jcH2FZeQ7l9vMCOah2cUfHDnMy+z\nKMiZdZx1bOCgM6p5f6gt+E7BnC6T9Vi0crnamZWNV0tljLBzgJa/PKKhJuMi\nWg9nAFprw7VLOpLE0HTLQ9JgKbKd3pupf5a+ANYWcpiwOMneu7e31orgWQms\nZAY8qQgrylRVNaqZ3pYvDk1cVubv69K11pFpJi2yDlxSA1wXj93ubN9jQ6la\nDw4eb3X5Ix064nRZ1VKgk7HlGJBrdUiKj6uBwU4B755IjmLOqP+2wPXgLiJx\n8CSI\r\n=kEcg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAwq87i4hc//WVSQMPwYtHvCbgddzvlwp5zaU7AhqLImAiEA4EfJp+o1TDG23Bl94WhenPZWlO8oYzwLd3Fu8cfH8uI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.4-alpha.3_1584120687701_0.6221432619980816"},"_hasShrinkwrap":false},"0.21.4-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.21.4-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.4-alpha.4+6ace760","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"6ace760dc99fe801acf633e78d913f2e5af4ab78","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.4-alpha.4","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-9JTFu/KxM8AYqTHEZqYrEzrx1rdi2GIlbmam201PgDaSQ+8beNG4Vp899C+19hHs34ZQU7Bbaj0VXEJuoBlxmw==","shasum":"0090d6d82d7ab93afb660c4357a2347cee16f4bc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.4-alpha.4.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8POCRA9TVsSAnZWagAAWjQP+wUJ7s2zZjRvFqhddUri\n2OUfXqC4go/4RnLQHkjHXLqzE6vduptcfaeNdN/lW3qfkpVCi5n3+A7YLZqV\n3CKra2QJRcEOX+ctJCrThtT/w38dWF5lzdjp6ddSMnTtdMppyzgnhv+9Q5Yl\n/SZ2fhNb483hIOxv2YF6QM1q6OffiGo4jXh9KkJ953w5uuTRDzNZqptkYBLf\ncWsA4sDnEV+OPa5ITSKsgvHgLppxSWlC8ZetbajupkPsVSLO01vzDsVVTU65\n8/FOuz8UDUe9G+DZ8nJzkk7vJ3jPJGeLtJZCnraKXENO9RcSJ55AKRaNjVrc\nSuG5cvvGsgn19zc/jlAdU8F23NVixkYumzvg6CYjUAffpRQHJ693xgRrLTCL\n5EtyWsa5FKz+J/Lo8q5ih+QN4AqHZGcm9WRHRX51rqm3FSWf2HKdaZxdEF42\nrNpaQyyB33gtvUbXmVRrw3Lb3JX+3cXV5o8Bk5oYDJDX6CQWSbYavidmsQOQ\nAPbcq3YOY1CS2wse1L5zh4VwS6oDNn4rTKsO89pO4mbW9p6wA5YgbJ6T3JfB\nT53CFxFY+r5c8YPlQGLWECHDjdiXORdIpA0YNuKC9qjtj8f7dtyUh6F/sHCx\nz6n5talW58GxjQyTKwPh6dZtXR1E5/UMZ0dTZROd08Yo2BUvbJ3WPeQ7pQng\nXQPG\r\n=oeQC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD82p0qwmJncUvAPJSJ/MH+HQT+zdvAPX7LgbTFOb/RPAIgAWGtXCJgNLvD18p75me42XgjNeixQgjGxB+M2v9xzrg="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.4-alpha.4_1584120781913_0.3999963909015638"},"_hasShrinkwrap":false},"0.21.4":{"name":"@react-ssr/nestjs-express","version":"0.21.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.4","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"73315b302e5f5cd9ba1ca1583d177755802aafc8","_id":"@react-ssr/nestjs-express@0.21.4","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-dT87ydFpPvPxbT8OUpIJZ+cbAk235/GJlLnBtmNDOucbkoRJ7E7SnjyZBTqc2Z3h2XfZ1CROX9vG+7YWylYkcw==","shasum":"44c1414a9b0a39635c9917b6fce346d36cbd5040","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.4.tgz","fileCount":8,"unpackedSize":16663,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8SdCRA9TVsSAnZWagAANSwQAJFjgo4XpCZC/vT1I3ge\n2/xECc0NnJN7E9I6iHbLvmUHYmiUrQQjHPaO8NRaifzSg7NVxRLoCFsxgFlm\nFNY7j+Rh0toaSS16In9hatHXolEBkJDDBnK3B3S6eR215KLbNJakvS4wDI8Z\nK4+4jRQuFTmhjFEWzIfEJLOilQiWaFSh6kHvPth18CVElcphNlDgrnWwjEU4\nfZRqqs2NzGygEK/nL6MzcsRv4YQTZwImwrIpMctgpzszS+c4kQan3pNLPi2c\nWecZHS24TyHsbi8Jhb258WlChiIg7CQo+ke5yULO1sttMLwXH8UKZabRbPu2\nnumrFTknQJnnin/FpY9jfFxC2GqIBi8OOaRkpPpCEQMDxgI+jYKqoZ+iqvdE\nOxoHMON9r6Ztux1c5z610TylYCH5mzU0atrz77AXxIIFP0lMMdvIAmyZZqIB\nftBo+3R37OPEsUlsLrIhE9NkRHBuj4spUq5gXwHE+WypvBtmGAP7Z8dw7soZ\nFfGOjPhJ0HGBUwXlvEyYlFyHgZGQmkf3IWiMK+2ByNuwpEHHkbptiLR2jh5X\n7bGQF4mTpB//AFSD5wl8YHyzeqk1NnstsdWrqiciC2o/UQJPS7QPi5KbFT+X\nbKEZlTzU+zDGDLZp2pmG2H+ASaQjRAAqXnB6is8yA5XVnqILA1CljmhkJlNQ\n4Sm9\r\n=CxD4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCDwg8gjzmdO4vGBIhT1XGcw1JceWejcavtdz/rKWyLmQIgelFFy32pnDUS9lRaSo/Wdi8hOzibPaDwnP7/0pDE/+M="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.4_1584120989361_0.5129984626543205"},"_hasShrinkwrap":false},"0.21.5-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.0+f0f4952","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"f0f495221c01f018252a8a00789eac7f47ec2edd","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.0","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-j4U/GXor0tbn7r/uFjw5I5sR9hfGj5fbBD0XVUJhANXMAOh5B9npZv+HCP+1/YRKhmMxgGV+iQruJQEjW4rUFg==","shasum":"3a63ae16a587ebb81142f729e538019b6c1dbf38","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.0.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8b3CRA9TVsSAnZWagAAYGYP/0Y33Tc2yhZXZ+BctZNy\nkVUkkht38ajnc/C63g2NkqVbSpn1GQssgKzlf+jbwjbv3TcnZfQ/2PhT1eze\nA27K2YAuSkKOxgat2R6EFylz6IJrgDCxGCbAr0WpXTQp4niHq2ZTF6X0lfL1\n1ago24LQayaWFKJ4/jfk2YvPuIM3Hu5ILz8qnBAY+IqXynp7oudgUJ4/NeZs\nd5HBo+aeSIJYYn+82AP/pwu3aRLavCgV8djxORi4SHopbmzzBTYN2g7TIEEK\nQTM7KBMBnZrP3s6yWbh3/kxi8DspF5xHCJ15lcpP6TZGis5yBL3FJOYcea3A\n28id+n/bmmqymExK2YSIoZ0NsZGOitc/CCM0rC/4F8EZLSNmx1lE+qaiJBGu\nyMcnOQ23MNsV93hVc8BXKXwh2EOmQHvKHolzg4TOz5sPK6y7Ie0YyvLdYicY\nOngvEjeLGAT1Prk3JBC5iopIj55V/t8eBqrvIz+kvDmMH8vuIv7geEXVR7XV\n2xEAxwDLBDxUM7a+ylHpFJ9Mpf1KcxLDk2GhNHEBeCA4pLvTgaiO7/5BLM3e\n0wiRzaLh0WrnExER51fqXRCXQCNLW8/oI6pxat0P6y21yX5d4knA4PZnVhOx\nkLbrA436wu040p1JlgM+zwTbxYFAqEFeBSKDf9BbFrKptecVtJvypdU90WgJ\nBJlq\r\n=IWBf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBTDHm7g+DLhED/aZf661GOrUgfqhrNNaVGeBmT/vikbAiA9UJnCEgVTXDw394EU9w0mI5CpiC1vVzCOICtXs/wAkw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.0_1584121590924_0.784450480155346"},"_hasShrinkwrap":false},"0.21.5-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.1+4cd5e7a","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"4cd5e7abd820248699cb2458fa1ead79b6da1584","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-I7YXvNtmIE2JKh+pZf3Sx/Sn1P/4HRajyqSuAUaArty91zqNJAlOgMV4pp2/Utpfu3eLdmi3yTxc+Z0t+ZdDlQ==","shasum":"a355d6ce94b35d22dfeb480c55b354605d643142","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.1.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8jnCRA9TVsSAnZWagAA2A0P/RZiQnvIJQEqw02eZLGM\nJT2t+5NFlLUvOrdiyfuoiieKSSK/w9lqSHw5+TFnWdQDCdJAs9vROYJ1MX0g\nG7cLn7OJGH4kAy8Pg/SIHZ4PHD3j2y7fGg+Wnwbh8oPhI6AhiPlD5eOPYsDw\n62aUQz0CJY3bMF6b/ZSOPTRrR6e7GJOCBpLkbyXcuhzffGSyxAI6iuhBOMdH\n2swNTaGr40ABniXEwiBFMwbJ4VSdm6xrntF9GFCD42COn8A8gdqDA8aSUyz/\n9k7z9VP1Xe+yUw+eo+Snwxw+0dyV5QVul38TnqdOzefjyuPUgkVIT+TL2Bg+\nGqmhWcFcrYC4KXblDQONuS1uqsJhVFuaG/oi+e+s1wJH8osqM7SWQhNWjANC\nFqpCJqOy7TDgYdluT9s4n+AepKBXxzyqb2ZN9NfdIvWJf36NbSneSszou6vq\noxQGGeLwLgxPwD0E3o2g2MvxYrLVHGjxShLEPrXzNtO0RKhkMPXnL3i+4dtB\nB8+r8A4n6S1hkIMMI3t798LE+J0n0dWuYNotMa5LneZMdDtd9D3avVCDBWFw\nn4jvhWxus9UFHKqJsIkUUv7j755AnTzJRkLz7iKwT1xdsVOmgatP+LV0CU6L\ncNnHCFcngkZcg6cwVFsuHIBScC6/FUBZUK1txpFsOrpkY8z/fVtb1ncwIJZ+\nGzeG\r\n=sqBx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCaK5SAXgkJg0pjrxUtNV44UzIIuUxMNojhLCSILzc9hQIgQH+3BfacNgOZLeLdQ+YLREzhDjBJO4XRBveTKXmAWtk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.1_1584122087306_0.049161542657996105"},"_hasShrinkwrap":false},"0.21.5-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.2+0d69e6e","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"0d69e6e92e9f14e0139136380b15ceee31fe144b","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-dLpUpFdkYdpqW2I8xh1WpBgkVtcV4W4CRl7ObJdZm6u5uTERnrCG9a6/+edydmZhr9sVAvYD3ZCC3pPRjK+K4Q==","shasum":"d92f8480ac40c669564a08a3a66e1b66ac0933e0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.2.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8mqCRA9TVsSAnZWagAADkkP/i33OVqODtotvl/9c8JR\ntyueW2r16CqPUNgMl5gsvlGz2vUEo/LbjPLwz2ORHKgyhC8yiIJXvR4srS5g\nw7zCn3yIThzaT1KEeyQ307XjdK+hn/4gQB6y9G608DbENsSFaqiV6JKo0ZX1\n223feKdrF8NbBFE52B41F6yIyQm6Iqh7X1h0C+gR268FprHXv1AawFNGZH4D\nVw3qfgztIYgyNCu9l1IMmNHiXb/fe3TzxyPRg06D0cy2wBRSxmXv/SHCcEu5\nbS6UUOQ9FUVCKHOwFImtcLbGJBLpvboieu+wdD4kndY1Up+J/vSdUntvwMwD\nEjbAQdQPYGPzfRswQ5/z5+e5NN9Cp6q300DqZSwFYhoVaqMmFoVGNIzPlBX9\nbS4bZaGT2VyjRjgrQp3b2Y9ajsOx1u2Ov5Rqhzfnoi5u48xFOTRfEXprwKH+\npIHzJi3pSnMOq5jkbwEfUcZ+NyKUoqclhLSze1TxmcKLsmBe/h2fqEOCD5Ip\nnr1MXkNw5F3xO6OkFraVOwSpu2XttB0UVNIL9G/dXvvJFf5H9/eS0Rzvjj9Z\nFUy9PX908aoDDg84cYNF8fCU25GlEfG2FfR6Ve8nwR8HjxexFGjP2IybQHNl\nvAEB7KGOOT9AJqxnOvqmDs1L4A+uJ04F3Kij2vYwlam6C1z1WVVbZnf/Quwx\ncTR3\r\n=vUHt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB9uL5HTQHfnGEsoDSYI+vhyrWur9s9HoafHzFUrLWYgAiEAoGm5S6KlhDOZJk1Tyxuwheay7MNjtYKzA1EsTzyjQqI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.2_1584122281613_0.2706575935618729"},"_hasShrinkwrap":false},"0.21.5-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.3+18146d3","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"18146d3f7d9a404492213bdaa0ec35a9dcc1d1ec","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.3","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-fBCaepBsUSbTokp4zWqnJW8B18dZxwmJUrjK3aeH8V8umoQOxpIigd3IktKi1FhzpWg5ENTSPGhVyA9bQCx89Q==","shasum":"2a78a9765c10c6405830619593ed2690103ffc52","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.3.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8pyCRA9TVsSAnZWagAAlhsP/iJJLhrFLUWxPYk0jdOh\nMKm+SGxx3C0tHBlMyXsj9NbjdIhx/w4iCLZswfRBxbLE5w/T02/V7V8Pd8TE\nl2YlWRUqhelCxEd+nFSmpXJOllK647ZRy6zpunEFvJo5L+PgPpNPl0q4PNSh\n+xFHwsknFwQ0j9h5fWtqZw8aZ91etlqNB+oJ9DbLrXonzg4M6+Y7bkN1R+eK\ns/aSaztf3UyrFUNfLw/0ZDXmoWZccCXPVkFya8e7BYpspw5z4xPZft97qlQ5\nVDHfYlgduCpbEle3msP+OXW8TTNCr3v6r4wxu3P/rvgeA6N8CqGKdb5BOQjn\nO2uWsL1RecnAAYbbfkiSykmIkf0SlI7Jf1xZd3lQsjg+8BjlvavtgRGXXreu\nmu8gFMG7/l1/6T9CuHCPQx5CIBA+ibAmWQZ1UFKlWKib9Po1ks00biCHTF/7\n9CNInYi2DvDG+hIETvsKgw7eM1VpcXZXe6sUaqG5DqRSOazp430l0+ksjYOU\nHvdiBBOBSSzEptsaLsEWVBxd81OJBeAw9tnruBd2zXZ9DVP7qO7aSn4VZj48\nmw2nW8sKGuaAe/7fMNbUSB0ZoSEXx23+ipS2CJ0z171uhB4vNiMzDIIrHpkp\nttGbcA58WHgfJrsL9eLl0jeMsKEkK3F7SAbaPOvDwZu3Z++3/uUPdJiWcjaJ\nIUHm\r\n=B9s1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD45rb8YTPQ+jdRUsTYPXXp6B7lbBqH0P0taf8/z9x9NAIhAKfHt7krjSOHjumpzBb0UdoSslLu1moOBQa6JkCyp8lD"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.3_1584122482268_0.7666939272544238"},"_hasShrinkwrap":false},"0.21.5-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.4+c7ca590","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"c7ca590f551c305683e4f62dc60077a4ef329803","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.4","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-h5a4YCF1UFcKw0H6FUvN/uoISqDT9q87Eks0Yd/TiCcSGOzv2OL9d38mj048//xu24UukEP0GX1fUDPB92KOpA==","shasum":"8ca9247ee884a3744cccede4572c32d0138a6fe9","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.4.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8rmCRA9TVsSAnZWagAA6AgP/31jc4vXyHD5Qy+FMChg\nt7QEGr2Hlou3bvGjNnWmwpgP2k/3okpi5JJ5fP7pF5CnL+5L1M7GDdNLQcaT\ncj8+mUMBeT57Z71mV8if3MjekZjUksf7XPHOIlNt12xg0tdjXXPr9Dv2lSZQ\nnS0cEqZmotxZ6SJ2p1rqRfL+GiYton1VMVBHOmuNAzWFmTI5Yq2JEvq5KDfR\nON4SVoer2ec+UoBD73ML7d3F649QDcvAVyQq9JUB3DX8o+aZr7w90r0O1+No\ncaCA7qk9oQ81DgLtG1zZHv8qL7dGxXPE19JQUrfAr3BY26z6kgGf0J5cbOrK\nL9cDjNsTc9HahS2vON9jGakeBY6rUgntv84yctBgFkoaz/BvWsd07eC3g7F7\nZROiCH8aDkf5btaUSi3QPDwzQSxZJvsupYKwy1fCjdTnbQoIR6IEkDM4Q41w\nVRoU4J3v23J+UA3LTDzDRo7+ZDLp845p+Am8uuopYJe2dwtepJ9tjLEMFwkO\npxN/6hI7sI77W4hrBjY9o95daPZTAkvuKQ/4/MEHSE9trOC+fBG2FWcK7wLj\nujZlLHyXQ5yuGWEoArjfSmbwZkAZoLabKUeRe3zDplAgkMAdl/ZNttnsRAEN\nHm6hdpw90ndta6jIIpJRd+qYdx4KyRccWh6vkHfA8iqaj0pQUXcB/8tFFj2X\n+BhE\r\n=38sm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD9GcwB/6j4PqJDLxakD3r/8kub1W8yhs3jI269kAuK1gIhAL+99R98PNdoqIy4pxTNYCF+z57Oir/0HydMI2lkMY1g"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.4_1584122598390_0.4348426847631919"},"_hasShrinkwrap":false},"0.21.5-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.5+4b5867a","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"4b5867a45430c75618219f1520b5623815904de1","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.5","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-VJFv5lzFLpNSZjOxMl4ACvTDmex1xfYeKO1S0Qar3u6YftPicw6Eve+XuMl1SQAkodMnSH2en7oDbfWOlixWKg==","shasum":"19433c6c2a4edfbf2c10bd239a98e270631fae98","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.5.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8v9CRA9TVsSAnZWagAAdZUP/0eREUHxru5RUr6A5mzK\nKl5XY2g5UXvzfHsMCRh09RfnWVPwtie6CI6rZVVAYojDnkfEf+6jonogRztq\nu8hGuF1yTlK5EHLxUuNGYhY5lbRBE08I7JbMXWcyIde45sQBAu2ieHHRCcPS\n3hllWSZnEXujFFadRU0Owo80RGPOJ4T/pdS2f4Yx1JlJgSCymJ2s2LgYbQFf\nFpusraVcyxmmou8wJMb4h5tPQ9ZlXb/+wxuI+spl0kBOXUHxz3DGNOBW+cSh\ni6PZy3MUCrlBwjRIbbCDAxjJ0foKp6A86DWbalTBfGT/3GvHkqAcBMM/Wulm\nPTVIadqzhhl8sEr8aJ4loo+qcxbWNiNjwYm0iMI80jKmjYJ3EsoRdW31ALgx\nIv9uvHhMGbHEgu5LVNCKGTrOV1ft73Z+mNkxs5JkLjkVntjkZpG+5CI1L40+\n05CMkdSd2MANV8+nIyo+2UkXAHh5EYUsaPSWTzQevjr/BJuuIFOcO0zNv9l8\nxBUXjhWmq1m1Wi8RzoHOeQjlhxiBrc/pyAk+CNJxYMLbtU2d8usw8vGM8+HK\nvRXmcxiLnKhwb3PsZZfdrxGmJTwkBT4t8yzDWnedmfYp7Bdafef6wXjPSoN6\ne83Ja+LjfTsI4k/kAu4ZBiqUWHKAsZneQ84Yv/5q7ovBoUpDj3tTfYULDuaD\nqbCy\r\n=LhUA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDbcaMXjaZwrHyTzXkuSzuI3rlckb2YolO9djw8yf/rBAiAkuWQddSExx1AYaJ6s3IHfsxtd6RDmtE+ajEcFJSNaDg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.5_1584122877410_0.08690196221477642"},"_hasShrinkwrap":false},"0.21.5-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.6+56dad84","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"56dad846be3d290303cc61246a5508e32bce8c9f","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.6","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-U3cOMZNRLQ7gcoVgz83EXsYKJRJwWztWJ4vYCXGxnVfsbUpV/Q3BIGAcvfiqvfQ51ugFHn56zCCoM97AryoD/A==","shasum":"2eb4f8a309ab9e9df6e8c9c4d81a1515818fdda3","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.6.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea84ECRA9TVsSAnZWagAAqEkQAIfsniYfEl6GagNmSM1Z\nhIvu2e5OHCnC/pVDI5NWZoJvWjHHTFJvOlN826mFUaVDFrGjzCfzcVVD086b\nKXmPXDgunt+tgGIzQLygCfM+/m+d5BGY5VDciDZ1iVdjpQfhwIgDG3izvMnF\npp8cpZLk7ohhrgrWiNWv0nwg0ZApg7T4S/uAJvAp5LPTCBQLWnhos2kf5u0g\nrft0TqNyT86WiRd+ktabBeeuHX6lB03MI6lpZnyWzRcFtp8TcCTOaCrB4Gap\nm05OjPfDRoqevP1QPyluJUvP5b5aAUpnhXBDJhOCTKP2sYIs0kVvS/P/uV0J\nvy7AKDL8P2zSWTvVtvRuR2cJDlmTcpBAVjazyOvt1Jcoja6FqxV1qijo4NDs\nMK0o5pZM285fQtp8ngQ4eeJN4ZELdP2Np0lLyRHpFFJ37h0Yev2rBH3nP3Ib\nI6pwEB0sdC2q96wBAlZ/LGpl2K0wkXrpqCfN66Cv7PSCYYwphOgbI0AE9+/g\nR46tCNxo5hGA4KrlthjThsvLtwDlEK5shPkrk7sD+oJG2Y/7azKJMKcvRmIe\nqSd7RHfFnxNDqxfw5kG5PGlsr+btUI7F+pxYbKZdTHA/l6DqKAktlODSRXJK\nzU7UtblEb+B0r2VKSmM2izXAaMLDWdeD9Jtsw4XP3Zf1k6VTfjSpLfWFIu+x\nTE7N\r\n=r6Kg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICuhpaFXzTTceeWL0mf+/Q4StXgFHGHF9LxofDYzWkkhAiAw14Xqexa/G3v8cP5ukllpRzWyH2cd18Cps8WddLhzbg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.6_1584123396278_0.7695603682057965"},"_hasShrinkwrap":false},"0.21.5-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.7+f57ac1e","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"f57ac1e1801bfd34a317247b04750c0d41707e79","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.7","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-2635BL02r3yjjxpQj25huJTpNAFR23SemMC7gYPVktmG7QtHuMrUqd8fAd7wZ9kbPwGqMIbEGomZdbuf/nJXoA==","shasum":"e29036fa35cf08e5a304666d07f80c1e3e92819d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.7.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea8/sCRA9TVsSAnZWagAAsksQAJrCPzARBJ2b2M5fs5Fs\nh31o2AbfoFQKlXsbJMc9tgzoIcFv7/RphGiSpU4CAigoZDRB9u7Xox1UgXB5\nStPCXEqUnryU473PdIq/12oNSSgVABhFlPrtXeM6lVkedkbowROwDS4r1cPL\nw79YPjFvzrKE43XCDomvZhxT756pzLyusAmFXPgfiEUTGcBj3b/QN9QV8J8u\niMM2Yo9/Zr6PigvJYNnp8whL/Q1061MYfXG6P19zRBcUeo0RneqRaWzCYT5Q\nwwdhP/8+s26H3U0jQ2Mvuk5hg5XeMRzL89uBfgRze/Y/8uKjheGy3H+6fNFQ\nFwLBU496TQ2sO7bpJ0xejuzmEMc36xVfx+3zrFSc9C83o24Cj1SC5kPwJ6kS\nOsStez5nwwMftY4Z1T0dbqMc9hBL933jKRWRRvrl8sXkipFEYjd0nhgvvNZE\nSIkOtE4C/f6hraGOUNyifJPzoPm12QNbIIIVEVGJCnVLYoEINmfvxUHw2eik\nPGW1j+fvw6uBYdhP8kzG0AoCCnDbAMfwBqhkQmy+X0OVoi8W2p9/IYVWNqle\nw3iqM+DjE/eFURbohsfY9wkyAyggxkVeYt4i2yFGItzG0PNa77/JaOaANTWr\nsksuEtVPwcSSQ12OJ/qtnc8/Y7CeDrs7Tfnme1YmdG5KvWBGBu9Cqz9OnWdr\nTk03\r\n=J/qL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCWWpiPrXaSxLAP3e97cMBy1mz4IlrFeqoWREEgEO9N8QIgd7KtqVvOUGN/SbrGslaOm9ZZ7N1zp5VcE/vuwW+l1Gc="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.7_1584123884360_0.8946987165790647"},"_hasShrinkwrap":false},"0.21.5-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.8+5a3c32e","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"5a3c32ebdb577f5dcb1e75d4a4dcfecd83130cdc","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.8","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-vyTkZTyW/AYVniGbNCl7RRc5tjaW9dlyAb5kyDsAA23BxrO8gRhDksOwzMsi6H1zBPkJzt/OsVmFA8ZbZS0WTA==","shasum":"4d5069b2710f6aaa65d75197ae7472def1b19516","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.8.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9C3CRA9TVsSAnZWagAAKA4P/j3/dZ9HrcDhLfC5+IR7\n+GE4M9umBTFYozrBccBIgTgbJp1JnaqWtJ5FJCR8d5RmlXpaKwNonIwDRUGN\n5w0sOnxaNb/f8IvaGBfwfFVW+MDAPyeYPpRk1WzIziHJdJEWqAwliCTco59n\nWSLNUVPYDCGU59EfcVx880JbBvzTJaWm2o/LACB1TuU42D3u3wN6sEh4dSY/\nGM51rPsy+mdnCJhS1jZmxVO4KJXVvXcc0PWg7TJTM+3DVftQMkSDMK0fHcW8\nQMeiyF5z/6KgoAEgnB4iuAycNFGI91szYckIp6g62bbpK7ztcQmzO+qGHaA7\n2ZTaZIFiqfVWtIv7VGPGrRHrSpFrp0CJOYZ7XwNTEo8Tjmi73h+jUUF/5Jo9\nhnu2CItNRmVUVcphvOGdBNpw+mUCZzUcX2koUW+7wYWIOWELnjOekGiKEjVM\nXEUdTXs+KU4CmNi1JYBdhI+zoZzXNPiGkX40Lmt6uPNjkr6UnwCIU7WyDuM2\nQfl40cwLhN5Qjzk44c5sEKnL/o1cX6U3raRK1rNCRkQemtboxOo6WXBwz8aG\nVPN2P2AE55KvCKevaL97hA/OqV6ZcGLlrGXzI7Jo7eonggU+tGUJB4hdFCEj\ngSgBGNZVqEp+2HOhNdwwg+Bh2W/D9Pnwb9FXizpw9zJAmQFzyYN6SDIkLtF2\n6zVR\r\n=LDkv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID5gJv+Lv88fPjAL5q+BsQ/j2JO+q47QgNFoRB18cmBlAiEAnpS35hwTPcu+rZ9BrFK1/R4T49yOB98KRD9zg+Z1BNo="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.8_1584124086627_0.4586471660974749"},"_hasShrinkwrap":false},"0.21.5-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.9+f70a384","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"f70a3842e0eea80c59e03c8bf9d9475e5da88c48","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.9","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-dGyG7LHRSaiEW6/BkeLWaUr1kj/ObXHTa0wAFqNQPH+vFwfGZfIk1uc+GUdEdKzFlJk7GklNndH/2w75sdSYTA==","shasum":"a92ad32943505176192a595bc44a3418b8771ad1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.9.tgz","fileCount":8,"unpackedSize":16695,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9H+CRA9TVsSAnZWagAAyt4P/i9zZq9OdE/kMoDCe+ke\nmwXeG7GqU60Ha8k8sDsy8lVCniRmCGUnpBChb6JMB87tSMSbLqCyX8w4ETiV\nYQpjfEKxMbzhcCDG1yu3mG1oKd1h1RJt0P6CdZK34nLd/+SimhEebuvcZnV/\nkEVnmOkRr2XjLzulNwaM78AMrhiSJZCfmx4cp/KFtC8CU5CnzYbU+Jb5w0U3\njbak4QRrap/x2hnGhFTG35789kCzhxOiNTKsBcFQqtThkT3wbDUBC2lnMMkY\nGU8NWuD45hmm38/446e6477dFhuCcg6CGLKOwRn//ykZuiTndevZscZbqp5I\n9lRj9oGdUXCcoQyP6UfZL84r8nT4h5pTdujP7VUtEn3B8s1eRLoe5faDVANF\nssjotGcSJnF0T4hvBKqjUx8kd2AiSO/PWGUJMXDe6vBnzlELKD10h2A1bDsL\nPjf2wnGHOAVoqeTQbjOSY1Jy0laNoCTDNXRDpYONZqyFpxib/IfrAvJf6Gom\nnw6+p3bBio3b7c42SmR2bo6or4AJd4tyfxxlFgGvTzd1bfKid7MEBTBMEc9o\nZksT7Vwu4w3aBKTjqyy7ta54uGr7Rr9N3RNrHPHcNH7/jTTmq+Oz1jcyowLR\nTryWajSBIQg/REBSYhPb6Vu5v2yMew3w0bAOFr/S6PR/hEdkrrt55acCXP/q\nFiPk\r\n=6UQO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDAMyAb9c8OW4poT/g8nIh6HOVD1SlsXR9pv7Cx8CsvYQIgZS0mPCd8YFl3FgARtzdhVzmx/39oMrYZMFVNGTGxATI="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.9_1584124413661_0.8576038277996576"},"_hasShrinkwrap":false},"0.21.5-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.10+7e46c0d","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"7e46c0d6fe44242717c975eabecfe25ce0773cfc","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.10","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-+sbruIl5xWd8K4fjTZnEjjJa2jKxwLgxwURaMtn7m6EekDVBQi8Yz9PppeqqBJD4EDus9KfOfj069DxVPqbjXg==","shasum":"b79f40fb3a9131ada886476beed765cbea5046d0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.10.tgz","fileCount":8,"unpackedSize":16697,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9JsCRA9TVsSAnZWagAACdcP/ArddhOW+u2dmOt/zXRU\nx8UgL6TF3LycA2i1Euwll0jdXTPH2iIHXu+PRtyK3KQFJU81vIS2vQbCDVso\nR+d3jGO3rpHvWkVOtKq48zVubo09lBaBZYZqFszRQNnmqSoz9lN9s0iwYyq9\nKNIhfHlbZWoX7Q9Ectqp21ASh/cUgBbn/B2h6krfgWPmoyU7nfQknuutYYhb\nIBFs2cXIZ9FrCk0Fu4rhuldR/RR5ogI2RZiNnXY7PLiHm1n2it7V3MLSYzB9\n0Phxdq7HXWcT4QbDe7VQTQxSC35LcfhHazvHRxCMuzMwUmr8FGCPWvrPfMy6\npVkRoX3qPctMgnXze6X7N+u+OXCIgqwCYsb1sAm7rqxiylNTSsVjjEcjXJdw\naOq5J+FZZc+BoZM08IAZkmMfnVPEcNQP22IgoFZn2l8o4Vm/oGUK2V9U00ZQ\nqu/yovbZva9dbdpnj537g4foY7y8GbuxZXEg/aR51o/znzLbKROFAN/SzwSO\nulwCdOwc9wA9B/xrIpkEVKSawYdBqPxEfU5EAqlfiJQ4sGYqrAMygUUxfb0k\nTTkXET2lsn+2vMEjxw7eQRH4IJNaAYqQg20ZWUfkH4aO+hpiUtdbTQziPcCh\nN7tv8300Cd35lhBQ20Pp3VN7tdr366uTmiGlX2FwJuJbIbdV9mvvrXidU+jd\n/hQi\r\n=GePr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDoSJhGiPuJzyp1MVGDi6wq3y7RrS0m7Pn7gE0cfJcLWgIgew45TCZvkoRGrsTFLemJU277hJ2ooPJlD7E+UgPjlUk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.10_1584124523706_0.7287479812926083"},"_hasShrinkwrap":false},"0.21.5-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.11+713b6a0","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"713b6a0811524bbcebeeaa408d42ba99c1756409","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.11","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-POzWvBXhgdzI/35wT22e5GrXl1h3TM7nfIEj/CiPpSPSbYjCpejKZ6gpcyFbatqNXBQB+cVlVFrY4LhQHi6ctA==","shasum":"5d5ad4e56b0ab52a553bca175edc8f7be622bee2","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.11.tgz","fileCount":8,"unpackedSize":16697,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9NECRA9TVsSAnZWagAAX54QAJTnTw0jLyw9VyJCwAyO\ntzkm0DrTKxNd5nlxE8LXdbQFKEnlOZw+KoC/tGm4+mKfh/1DHVlMIJ5SYF/d\n/T8AY5nk3r+ztzKPBec4HwbGrezvMatBoSjNNZrKfUZGxhy8ROeRp/mdpQrt\n1CeI84eyQvQ4fBZJqqsQwTdGGjfC7mw8+VxwVh54sjc9GTZK///OaMKj6qro\n5KU3Wga5fQ79LOuG3yxryjS/1kZlu2Yz0VaysiGGEk/TVmEk+ddS8wSLgJWz\nC7Na/kgO4rLrkUZe6P3jIMFaeFj4kDSL+npuj+OQIBOFDeW1Ybn9HOj/zZ1D\nQVOfX1TYaQoyccT/AodbhkiErvCTXI2e5oFsDAZn2dIE5z7UT6QDkpcDwm0N\nVwJfcIqLU5Wqg3saN3b+7JzlRPxdXvqPYlZ2KZmejJxWrrqsboCEtmYsXO2+\nYQaByzRpfBmsgGgS2rSB8/6kb5qDilo60Crvr68MO+zZJbIPJe6uni1OVone\nceDWknH6PCduV6Fc0MDjeZcZxrfDdqcd0BkFgbrOFbAcIqWbiOD8nz2EhjuP\nmIFqR3PgQ5DT5zP776cZquFIxkZYgEJHfeKkEqEweMewCkAU/XEG+icWLhRn\nvsd3/Iy5xaeTgx1mbMbNuMdUpN6euUYs3V2bHBiEawipWAbeCMQ2VasSY5xG\nRa6J\r\n=lmxH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIC9qKNTF2cep/UJ6IkljU0H/vA3EYsBEK8HHTxEKeaLAAiAG5UtfXj+fLCUwKXjhUxu0vl7Z4ALDHSCj3LWwMe5mlQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.11_1584124739613_0.7131155208240705"},"_hasShrinkwrap":false},"0.21.5-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.12+37b5434","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"37b5434a7d0d680c8581e5a54fb322d668f6c2c8","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.12","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-GVyztzMDJ1mU6kd+SsTleazM0+CXA0qB4xLFZoa4Ez4NVHTyZOT9eVW6PVLKUlb3JYbjxjq+OKonGmh37pEVDg==","shasum":"c9cbed5dbc541c7036a725f80a3fd64edd00f561","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.12.tgz","fileCount":8,"unpackedSize":16697,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9QoCRA9TVsSAnZWagAA8EoP/RTwfEv8GlEL5sURp+kl\nWGAKQ+762OsEmJUNT7qzTh260ZnszQb2ilPSYTJdDKqg0j9IcoqwAA4kxvKd\nsCDQZ5RE97jEj5T4V6eexME77l5n6S8k1Zgzga1pj44DDQZDUWu+ceh+BZ/I\nucDHPbgdg8RJPcNPPhNgJl6L473yxb+g4xfXb9Kwy9QEQktbd/LK8DvAsbrn\nO3+p7d0YEwBeb/MHaSfYRChr3eQiWDB+WxyBUw3y/tdKxdP7xwL1XmzfdXwh\nuoALBBZqRsFb/b+TXUn1grhyuao7Kekmca71pNGILfloGy2X0JVCPjaDm5+F\ngiX3ZNxumsXZhCRZM8WludreOhhwIGZFZyHCHZ+0KFxa+meBP8LWVbrggnSn\nS8Xb0itFoj0iG7YRidHnx0b2xxMprr+Of5aK+/L5Cuay59VmCwjNc2u9xLki\nVn1i9cFcdqvh+Cr5BfoCkd9RQCj1gEQ+VM9iZ4/dytRTnQh+y5sp82qMQDFC\natTPTiL25oKzEMl5kz/sEqnnuwsj3EjrAxdNO9gmNT6KaPmKrKHABnr3Spqa\ncDr3Ny1rR0KxKTSnBhlbtWCPXHTWltKFfYCh03B1xtVI5dpYLsQocCJtT7OW\nAbBZ2uFKYwGuEPbizCGYZoad4dmh0MnHLe6mRH3jUvFbiYd5kGpOauXXtt1g\nT6fx\r\n=PtTr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDP76JPXrVQ6s+SSFXi4UDbh6GLoF9+SZspRwEc3t/nSQIgZiaWGIKOR1rEhyKOnF6xpi1Dzs03n3b0/u2KdQ21ipY="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.12_1584124968214_0.5472243132342911"},"_hasShrinkwrap":false},"0.21.5-alpha.13":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.13+346defe","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"346defe82c2d4618d04f9b416c181c20c8b2455c","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.13","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-iQwJ5rg8+sfnqviI3wFkVXK3GIjuHzIE0HFaSnNSa3mGL+551cZY9aMRlDbuNGlUqjhGm1+M6NFTCDtHYZBRrw==","shasum":"8736e335b7d65fff3c9666f6ec4d4cc80c719b43","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.13.tgz","fileCount":8,"unpackedSize":16697,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9TBCRA9TVsSAnZWagAA3m4P/1URtXYS4TQJh3797ASK\nA8Hx2zq3oLZQMaPkLGdFBl6If15BEjXwh+SoHVlBVIFYmqlFgkThpQzmIz7r\njUeApiTpA6N2/RbknKxfTpf/MxgfLmgSnDf+He4jqyM+ay7I3BpAgYSk/Cmo\n/HIKIfn7/F1wR4tnqNIDKVEQ/bkIjaN9K/Ad31S7VnGFeyURV/u5e/Epy6Sw\nrXzMftot7NSoxQpCoBBHeKxPbqg3iNz/L1JyR5O24lgdzhtxwp2bS2MqCfC6\n4Dh+50an5ofkDJsRGqMVywiL5C2aTqEKY8eXBiy46thpdHnf/7Q57LKGNGVw\nzUmBlkxCStHXvu3jfccoeTjyh4rH5p6N3U2kpr0Q75KOcEhOWGxATdEUXOck\n/RNFbxsMpk5a6KuDnBNAZ1CW5XlvLFyrBd4LoJU/r8/S3nD3pxK6Ws5+gOkP\np5IQhoLdwfnZW3kkBSBC+AmtnfNHIJmTyohj4IobWErs+s38xbFzWc0U6D9O\nGsSU51JDKDDZXt9oy1J6++nzPJwf/Lbbui/jhcP/diNoukI84x5Vebuipl6G\n06+ERvfPJTZqU+nFyytj/OW6CL9UQ4mOCfBM6S8CTmfPM78+Rg/eb2XpmTtp\ni+ddSwwhyoMLu3jPqxyR5g8Lnq5BV0QmXLYNI6dfnjOnXJNQoIwA5SfGm1Hg\nCJjz\r\n=rt6/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIE9PF14DP4KaGYno0t678wv695hIgVFkTEShLZ+ep9VVAiEA8dUDfR7DbAVaAw69LzbXLpaV8zuZj+GNVjDlGczQ89g="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.13_1584125121346_0.43873314047763934"},"_hasShrinkwrap":false},"0.21.5-alpha.14":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.14+f742f5d","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"f742f5db0b59bfea0c4f32ce8055f2626bfbaf96","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.14","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-T5zijFpfvbMJ6hPYr6TjVPW6jQM4FqSxUSCkvjag/WTEzCXWwtXBdTpBzX1qIl8wL+huPmuSERDbkccMl4Z3pQ==","shasum":"8aa13795180dc3c6a6d5040c06853b1e7499f78e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.14.tgz","fileCount":8,"unpackedSize":16697,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9U6CRA9TVsSAnZWagAAohoQAKIf0zJj2KnM3vQZ0PV3\nI71CMzk4oQYd/GXBC+8dQWI7jzC2dxBh2TLG0rr0CgRDeAo3whH0XDXZFhAt\nmfPHUR137YvRWr5OdwBmfeWJT1qJSm+cx0D62fIP8PY7wvhIMkoGwYBMdi0F\nsbU0b8F5cCOTwptK3FmwtTaRI16vQfeWaDnQsJgAV7aDieSYIYXXEvuyKpxP\nu+ifLNWRU+RxmJFirV1wNjwAuMUGXr6Sgi25pJFMsYyhW7mdyYjn2yzVv/rq\nghNsSpd5L30ucBVOaLvHDXzDKmP+Hzw4gQihj2AHl8bWBbsWgCRcxQz68Dw/\ni2yp7elNoMi6PmgfaeSeqkDLUjvGhQNxV4ljjVD65avHeZynrbqghEGWV37X\nOtTezQiJH8KWebG834zv4zo3D1ppyM3PDo4JxDynDplEzTbjYKfCd82bx52h\nY/k7Mtn9gIUYRbGmgX41YZERPXpzTSQlYo2mmxKwGHaucy2s7Jou2mFNNjYZ\n6vGJCPDuzXNnE7GbKGGWQB7HfvmgFB8Dx4eIZW1kaeOXTvAF8SKv4pn0tKM8\nh3EJnKjdloH+nWMxVCmETNBborXSpI34Tk6N8TtS/4k0oJu3PnAXhL+Reoae\nCkvn76fXOz6a7eMkix4cXbo1is1y5pf3Zdwv73YwE1QyfAoH/pKWU8VFCiC3\nT1xz\r\n=CT73\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICSA6+S4b5qW2B20w64bzRMWHbsENgUgCU0fl+8XVpEhAiAFE5GTfI2P7uYOwpmdKSFiK2wOt+X4Zs2bYIfwE1t2cw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.14_1584125242287_0.8119281600820447"},"_hasShrinkwrap":false},"0.21.5-alpha.15":{"name":"@react-ssr/nestjs-express","version":"0.21.5-alpha.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5-alpha.15+4515e29","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"4515e29ba23540ee7be3b138d94fb1a2beb891a7","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.5-alpha.15","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-fXj4fii5iEsaNzdGE39N/ROd3ECYpqY74S6kNycGCaJsen/fIJgPnlwcu48oznc/cBLMulOGClhMoMZXdVM5bg==","shasum":"7a2ff859fedd70bc85414a13e58ce7a92eabef5c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5-alpha.15.tgz","fileCount":8,"unpackedSize":16697,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9XbCRA9TVsSAnZWagAAFqEP/iI3wbQH3Z2BQe4bA6Iw\nEmwr+bIg+VMGIJNirdbYNwdHnulZFPONmrvKwYmILLjwUUWyeDNi/UCKXhZw\nr1A7llOFsRHwYVDEPSYq12SpPIDvIjWgaSJy72SiOjGoLnhRVBhVnt1b/mpn\nIFDRDYVbJh39uxM7AFXPtApoCm/dSia8AHYDeVAfjI2qoFg/AJVvJ4aopGhB\nXN82eNIMaQ6EEdX4frbbXiC5YG/ixXkEIDpfk1Vni/jew5eDo8O1F+t87uIH\nCc2OOBTvSmDfh0ql45U4CdAKqIcnTg70UdJpDRg1k50gJK+NCPchSKtEpzql\nP0Q+xGjhbDY1R9yeky1AKc/abBHe00FLw1Y7/upmOd5gpIKp6inVVf1XFWTl\nsGFu3optax5DB3wUtIPYJHPBwYdL/+fW/VX0v7B0P7kmpQSTA+4uXO1IEAZP\nBHkaiTiy0+s/oOk3U+7tqSgIHoemyDrxtbfZAkcCdNRbyjq4F6k6Jzlk2jhc\nXkhOyGSm1Yb+g+DNto0/LwbBtuXjQDZFN3z60MAgDjUTnGxYaoslaVr/Kxme\nqT8zRaIq5kJFsWPGxQpn8Ii3jUNDJp1SVuK/Ltd9myUwSFHQwRqWmb43wtDO\nVPD7HuXv5V05He+DLazC6OARJG8j9J6VKbKaUVL3Ca6VPdCNhx1Z6OY3qfZj\nx6ce\r\n=5kXT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFiJEiP5OqY0gR0x9DO9RORDEZcQNh+2/4KRLToutYTaAiAZPO0/HtyYbCblK80v/tjRr1jS49Jv2NpNCyAF2awe4w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5-alpha.15_1584125402749_0.22723962468714665"},"_hasShrinkwrap":false},"0.21.5":{"name":"@react-ssr/nestjs-express","version":"0.21.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6","@react-ssr/core":"^0.*"},"gitHead":"05891c7b1899848affd79507a21d733ef68a5d65","_id":"@react-ssr/nestjs-express@0.21.5","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-hM11agW8c/8IxMItJYUouSIhiRafXZVEnp5N1smRvJDfDptWz1QYOe1kLshwBy/Ntb5iAkCOduiSdoDg9vrMqg==","shasum":"acd67332760d8b7742b11360c749387bd5d687db","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.5.tgz","fileCount":8,"unpackedSize":16663,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJea9a5CRA9TVsSAnZWagAAOloP/33i/vXI7g6veo4IveqS\nwblF3Un0M+bJcNHrJ+QjFcfP0epRzmzf1BDYNE1pd73QMX6VXpFbLEj0GBFH\nAcdELmsL/TH1ufA8TdxlTA/cemodVWA5JFDJVeq0VqcsyriMvVJDyBy5m7yf\nzYj4eP4R8Qu1Tl/Nbc7A4C1R+tErvaUHWxGbGe5MZ5+RD8CsMtwjmBIPldAC\nJoxXziIJnLKxRgB2z00aLvZNab2T4oLovY7rj3lQhvy5ghP91j8WOCbfw+PE\nZw4brZ+jwubqr2gJnL9v3ycMq6LZpg+M5lZtKxhnxRRSMh092y766TK9XmAA\nseUIsaL5BszW+RX3B//NtEos6pzhtur2fHiM5uk4Vo40QEcTSYN4GtdRv/E3\nn+1jEzKXTTHZilgjYJn7/OjwrJmXZSESXBl8/SDINuWOrdutanCTgdHmuIq/\nTB6CyTaZF7v+ouryU0t5nYypCKOxVBSq0xCBQ9U1HXCcdpI/atvJQ2Zl6Lx0\nm/bDFd0/bEMK8OoMZfByybeaiRoEMpCn31Zuf2U2qO9yhRyJFF0LELza3nUt\nQjDX2E3Jce8umUSBD4m47sBiqeKzm1XtqjyKZAfJVaXlNNQ0hRsTSdiLpQfV\nSd7djMxc701HDf+s6golLGyvCudDyplJOKoUNHlHG0ouLuf2/o/AU5WNhGgM\n7ou6\r\n=WeZi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC++Ys475PKaS8bIkHYthzpi+EczO/w67LWfIXlZeoOWQIhAKzqUeHn1n/OsBMH5pqz7fv3c8xId9DTdhZMxoE5vK8s"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.5_1584125624446_0.904388881044933"},"_hasShrinkwrap":false},"0.21.6":{"name":"@react-ssr/nestjs-express","version":"0.21.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"ffc65446bbb4c881f2e4832aa78ed3c95ddedb31","_id":"@react-ssr/nestjs-express@0.21.6","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-rxK3hInuiIRQxpwd9JHCita/+5wpszRiSCN0f+IJo2xoXszZUjl0F67NX4CKE4ReUgmxBJZFP2sjq6Mr5vZXEA==","shasum":"e281099bc5bec4f3590e03ec22d514bc8f59feec","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.6.tgz","fileCount":8,"unpackedSize":16669,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJebdmMCRA9TVsSAnZWagAAw7kQAIn0Zu+aqcYJjmKOtVXv\nr7UqKsSVwxzOgVbJ3va5i6BJIlcGiHJdTwOGnN/3kIEmfwdM78hDsd3azwlY\n5cTNhW3eNEtV5jxgDkZLRmUVSqC614sQJNn83xkbYRkGJv8rkqo5w4ynMtuN\nsbZWyUDjYLyivtEI2MUsYq14pgAuUUpynLwvja0I4TEoKV/jObGqvy6dTfdZ\nBmRZJXtreNBNBvLrDAWGpr3ewNF0XARJ0E5pYkT+2gz4Gd9IekMFllbZqaUh\nafLRoc85D3lbUmaYpou13d5HBsu/C6AGtlu/mBxCX4leQP+OUKqk6cJ1N3yM\nRa/FpGiCAtkk9Ac+61JrXsqHf0vBjRyZ0rhQZIMzH8fhUbLHsDfkdvt5SxEW\nQWvPJZo71DwmjEhkXes2fuMGEja4M49hEFi6VxnfSwRSEvGfcFb64rbgAlxm\npvXhXbGHsVigM6vxmb33YEvdqxUmID16iAL6BarC7UZ33nTCDexnthp8/kfe\nVf4WHGFZZuV4RbPBqWlLGS+hWnhkd0SHkE4Bui48tEhf7knQq1k9C4GrmKx5\nX3AEygncy462UIlpnT72oHZCk5KfDjlu7sSz0xXslKd89vQm5DC23+CrdANT\ncg6QU53YLJcv9mt3VB2Yu1tBaP6e7AfNpLuygb5a8wFCAmaztxBgvX8s1Olu\nPfhP\r\n=sZjf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDYUhzCmAv+Kk2Gcki7kUXH1UOK5aUGuLd6PWGm89JqzAIgAQ4FhGMrJGhdWwGBudJwXUUoSjZI6LcT/MmBOw4qr4M="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.6_1584257420326_0.1354434537334379"},"_hasShrinkwrap":false},"0.21.7-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.21.7-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.7-alpha.0+d04e9ab","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"d04e9ab3d11672a72358daab18142089464c9ac7","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.7-alpha.0","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-zDtC2AQ5nAdF2PQ75PjeLFzt1xBAz7XA2MY+OAnrQk1evx2x+D1qn9NrqhQuiMevqZa26Tg/aLvgKpwAGI84vA==","shasum":"88c7cf6b982fd526c7bdbc472469ebfaf016c360","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.7-alpha.0.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJebdpaCRA9TVsSAnZWagAAvxEP/1zl/jYeRwei1adgH7q6\nq72fDpGXWpGZqsLngwahyBy7QMaNUEGernRjpxMZcFZBOzNBFZh1uRH4aAtW\neWB9IxtAhC0gyt2lIDkl8VPtSX13aEQVc3nav1UajY27Nd3ch6N7MKbj+83a\nCgk9BO9Pqtu/ZhNKIIcsUked+L8/fuWdvmDLeDJVk2VHcFew+Db2cBrTV+48\nTyaAGTHJQND51nrOKBdT5VuGYcgNMubVF3oMeGSKsLicHRY9weHDDSr+Xx8u\nxJ5LzLFKSblm/y3Hs9RJvtSazIaP5myMGlpKuWdR4YBDocE/6zacydFqpWo2\nwnUWr2GqOUFjXWt/kELz+HMuGIsW6vx2Nngn3apWGgaZVjkytPi+vtgxcQd/\nqLaAzlMKfgwjureZbwfnqzyYbmhEtnHA3hNflFnDfugNz+l+P1Uaoi5C1i1k\npFDqO+ejfWzUCSQxYbCCL4GpS8R2ArcgzeEQzlx+QJ1m5CS9blc8bWpz4UHv\nXyuoBQlVTuylncnLYM4Jgx/WZqMxd0aaLOqbvKEZC5k5O9T2yyEVO06VMzER\n+fIi02TPhnIsNWewNePkC/Wqv6tRVIQPqAPZuA5wuOnLWxpBVYng7gukFJb5\nUhkU9+LEk/hHSUV3d7cQWsKIhpogI1dRy3fXr0Zh+yjEEoSTNvOG3ZAPohoq\nr+2x\r\n=9aT0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFiGz+pdYumlKsgXiX6YEXYtE7ZkIJ1EEe2WaPiXLILWAiEA4tnI8Pq7CrQolgIeaRlG7wRa8+ZdRvJnfUMpyZnRJV4="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.7-alpha.0_1584257625619_0.05662294248125965"},"_hasShrinkwrap":false},"0.21.7-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.21.7-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.7-alpha.1+fa4ac72","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"fa4ac72d13926763806b19630ff7b50077e2cfe9","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.7-alpha.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-7dyUb0iaK4Iwj+rOq38duXID9aTgDoxOuVlM/DnUOvDhMAnauwsuVUTFf7VR9r0/EAFTvD5ukKQkAb4PnA40ng==","shasum":"eff89c329fa791c512e1aeb38d8c217e1247418a","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.7-alpha.1.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJebdraCRA9TVsSAnZWagAAoYUP/3jwnBr3nawwZnhsk0VH\nIpwxY34hscvmj73jeqq0XDP/znNjStOEACH7v4Nq5ZmzIo/v9IRhpH41pjj5\nO2QKVgH5yr0dRtDXLOmuz/kmI7oD+qVWFvBDZvdpybxT5vhU5vk6zw+bWeg8\niEhO7QnRDhZ+FKYnjhclshcta4eNGxzjGR/I64ewTCC0LvXl7lQ3ne783Teq\nEsEle0oB5+/qM9HPZYwWY+rhwuAOFtq/AmosHBL4Uo0OSB6xFXhcM8h59qHi\n65zEhHHEJJDkVZ6JauMNVVnIdDu70eVisFZ/3pcLTiSM4TerYa6HbdRqu7Rf\nVaTX+0YUW8qDfIRsMs4RK5lRibSthgD33FdiBYrsOnacwLXOYM7Eocn+Q6DV\nb37+3MCaW62Xb6qfhRD780a/Kf5uOzZdSh3+dk0DuRDtDXFgfDL88dF65Dmo\nfo7O7NIiDUXsgT4q9+d3OusXibGx7LIosEXeIhPHrZ8zrmCi7e4L/h5OaEwS\nFZVEsqK9M38FSQ3Imk40PwT6SaLDTMW70rxqaunj8Jv6Y024GoHVDqzI3Tep\niy1/bDCml8AXDLtqwLnxyRx9eIL3welWL3GR+uiSvt7xX+hSI+kF2E7yGkQY\npLP0vQRmvW2/TEi0Q6jSbTpV/NIIjrslcqQQFQ048cz480akmJR1yYfkeV8x\nGtGh\r\n=19iD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHjPJ8E03zyLmiGZ1oYm1HhaH1KMpeS6YtpIsAIwR2mtAiAXjQSyAWtY4Y3oNhJfXSOhCHRkzjsqfRhFAN2DIO3X7A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.7-alpha.1_1584257754044_0.5594315945633792"},"_hasShrinkwrap":false},"0.21.7-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.7-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.7-alpha.2+114659e","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"114659ec1d764069657f5ce09ba932e40a228bdd","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.7-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-MS7PN/Qoqgu7BepPUe8KW9H7YvVJ3wy8/0BizH0jIp84RzQVhKjRZj7b37EyTicslxwe/kEUG+WovaYQ0z4zjQ==","shasum":"e7abcdf52b395b28a6549ce44134f77e2200aa93","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.7-alpha.2.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJebd2cCRA9TVsSAnZWagAAvl4P/jG+PyRYlzLGvMBu4Mi1\n28HpTK/HbkmzUeK3Khz0TVSKWtyftkKkaM7zAyse5b3VyPBmAhCi48g00+iP\ns8PsBsFliz9VH7ghpZlBhPSipsOKhNud76WfUuw9pvsAO7TUpBcEP9+4KQtI\n75RbVKfWw7BQVKbdVRKVfoRN8uE40g4ERqL+snfYviUMy8cDwOjXXSkVYJHs\nMdHtNfj7Q+fOQs+UTOw0PRnHoisEN2Y/wofFTBs3XnLqWi97FAOJHqJY5Ctf\nh2zMQvZhXTuGEUTedbuhSU0v0DMgUPTqorccMASG0rTY0oDNYEP0F7G3HyW0\ntHJcNBrjeMiovXdO0/O3GNOqeXsDBGC4IwbGRa+jh6TZJhi9scJKd3Zs9B8w\nPZ7MmxJYoMlx3EqW42doDIcHhg6ghX9ZBCxZKDResWRfBHvXBQZx5QMlloba\nteTg4bKm8F/vpsGcc7iPaIf+b3SfwAjCOZcbSiOEVo4ekPOKOTtY5m6NH8mD\nEizOnLSBTajlnP1T4banTEozA0zgPFvmiAJMCzwnsi5LLM+6MRSfRhEU7RWn\nJ/z8E7iWLStr11s41+HJhvad+D5JfKrMQrGzCRZqPKpynhPgkwtcUX+wm8lo\nibvSlgNy3VW9J53vH8aSsNlqi+RSr7biRvdmHrOoe42Dt68nJqygouRROl7Y\nu54A\r\n=l5pF\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDMmnYjgM+CjcKYgfSit6uKPPkimatghH0lsGt12cKrEQIgYGJpYRpSb2paOXVKQcDQq+5+DDnEvPbSjKW9iOQLad8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.7-alpha.2_1584258459678_0.6661137592395581"},"_hasShrinkwrap":false},"0.21.7":{"name":"@react-ssr/nestjs-express","version":"0.21.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.7","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"dcca84e04e265f4be448d2c5e2ca654cc361eb91","_id":"@react-ssr/nestjs-express@0.21.7","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-OC95CXgFNn3hVuJyfSCj2yK4kUDO2m5cvm3gRnTLBloqy1LMjR6lFAHrsaTSC6HV1ubSxULV5BFLNoPr/heMrg==","shasum":"af573ce1e7d8a2259e43c2ec38baa7f9a6cdd6bc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.7.tgz","fileCount":8,"unpackedSize":16669,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJebeBqCRA9TVsSAnZWagAAivcQAJN57f0Fu8ANlvtpxPrs\nToRGdx9Mv/VmbA4Al/pwBqcE8JlFbnnAWTgt8xV454s6tcHG6e8vzaqt49OP\n0RcC04H9v3Bees0PpF2K423WfwxOrrMkdUCfqi/dTXer1RTvQkhjKaeKE5iz\nhSIIwEWliHFUw0nb4RDNxrF+b63DkfHe1MnGohbLXjmcpvzOY5/6Tpy/N56b\n6w3fju0910XwubjXAX9saV9zYP6waWXzui9FyzfcCCEVRGAsB4z4RbnaSR3b\ncEwQaPjQOytlIpSvSVXydLFr8hppDGaqhBKyy21N6tNzXlyhFbpgQ8EDk9gw\nJYdHfmN79zpHkfrLCTwyHEsAu5AN/wwiN2HkcBeLn2yKrV5jJTiC89B3DqxB\n0XhTIIM4o71sgUxj5XeJysjHwF9HCl6ol3LeeVdQvZ2LhRLIYg9hBUfKSO6E\nrjeOs1ZA/MD/1s9PF5q2r8aoZ2ER6OgskT6DHhRyKGSe+ClYvJFxzSNSI5Mc\nYdWfNFL+SPcYLNUxhPcWZp5xzQ6X0GRfJReoWicZJhjVvlX2kD6gy0DIYEx1\nocFCt0VrryISjtKFnKxnWhqqVI65le2jsIVCMdIB73dSlNtZv4j0RHLNdSZK\nqLfxeLvQk14GABdD/mjcxmBdAX2D2ZcJ1FUacaiQ7AnzOOw297vd3YPUUcoj\n1Bgy\r\n=tpde\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID2bU+8x6Mva1IdZ69pV+7VEm/SiqTPoamhQpvmWCgWaAiEA6L+wC2mkPTyNx3+ITIu8u/c2rPdLUQrz7Oo921c13/c="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.7_1584259178379_0.24776691430523345"},"_hasShrinkwrap":false},"0.21.8-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.21.8-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.8-alpha.0+ba58d2e","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"ba58d2e7b9004e8dcecc3d02aeed2815e804b750","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.8-alpha.0","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-Gwht85cXhUB5gtJtXX/pzosmZC916Y9Kx7RcoFrM5+LdH6qB14Cn90GZjWxHRFfCAN8Eym74yJ5rlPvyyJKMmQ==","shasum":"c3e8d443605d879e7babd82f2e0b406b7773728c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.8-alpha.0.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec0PkCRA9TVsSAnZWagAAvXIP+gMk0P/rMbuIhDqDQc2W\n5uZ2Kkzl6dLXqp6ZFU4CK9ShxNJwh0Mx3pR+5aWXTwKR7j+zytQnrNd0GDnf\nRfAO87cqwNJa8YsrRgoXYW6ffh2ViWXxggGT+J1bAzBQG7CNqOSbzvtON6ox\nM+N8otaXQURPm2pWqRFVm1apavyqpNp6XK+llg+rqrMlIbmngXXhfE+477a5\nKv3j/ZHmkehkwLGRlHRWbed6Hkc99CYvR9h7xZuNjroodjqNu9Yc2e0wdMid\nW4IPQazAFpqE0Or1m2iVFqg5JGHVuPxpLcxeH8I7wkjAPV9rmnWHmR9iKrNR\nOX5GPnDbU5VlaAJXA/rbG6+JEJ26klIhHJ2eOWN+D2yoAmOQ41S+J+b/rBDQ\nG9urirRAfnjed4G/jRgVqnWRdFr5MRy2C53MjP+dCo++3KK+kXs/5WVqf+36\nZx34oMqdijeULWwhfNzcEAF6UuMq54F4gwbiAL1W6NYJnNy67nSccapj337i\nzgaYdpN5D27AmKZdwAl0Hw5H61cz/u1mCcwXlS1KZw/grNB+PfW3lZ8MAVTe\niPois6X6AX5MJlE1cx8UYJSoDwqV0RZ3N/JuoKs4l2uQAyPqQSEwTou9NN7h\nOf43CglDdIQSiSaxqI04dwWe9pHAxCwRuvoKBCbbqyWO4I91KSvh/CBZ11zJ\nR0U7\r\n=oRdQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDpl/T0+TCgcnHLwNaLqsVolGyn6P5RBd6TdrgwxDI+CwIhAPQbIo47OCMnLk7Cq6jPHhN7yKFarZZy58pQ6hJOofVz"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.8-alpha.0_1584612324126_0.661707352506741"},"_hasShrinkwrap":false},"0.21.8-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.21.8-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.8-alpha.1+a7bec6f","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"a7bec6ff056a876dfb518a80fb448d0687a9c47c","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.8-alpha.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-Fm2SwlZc3bEZcfV0d3AEflhPMbzDBs8RAfOWwoc5tYkZE7xcyPOxG5BnWyTibKx8Fe9zc590eea6y6OEbr6kWg==","shasum":"27168e0cab835d5e2a03e6a5c612862d33bdd33f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.8-alpha.1.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec0SwCRA9TVsSAnZWagAAqC4P/39qkZf3SyXYq3ItCRki\nscg5V7Uuh6yuro2oTNno4YAgFDsUdOZuCs/yi7VjpYQo0OnqH8I6WNuKMtkW\nHSINMdSQc7pUItAD624lYzkCnOhQE2jaRZpcyMWEjPEfjhwO0F5y6UZ0zFsx\nk9C8fIhw1zrmPf0O0PdkZpNvrZPEaeM4C/cer8Zp2Ez5RbztHnZ5FfbM9wOK\naXPpEDvfXYJBOZzn/jrTDox4Z3ecHA4Lm0STnBdwoxLbD6CQz1DrTXsw5bH8\nHUw7PxOf8NsvPAtuz6MKSh0Bbyxvj5xq/AefEgXa5D57u8J9DpAzLLNpWGzl\nJGD+3R6R4bkiyyW1kljc/KAjc5uQSZqVZ5YPqsARgOAMbOwgi50vd8DqbYzZ\nYHU7xnmcdiQyThMLrfq2yu80dgZaGER0ROu07jgKODJ7/vQ8cwRgnQdFwRwp\nJ7hkTjG1BUFHBFWzB/Vulyp6AUcmdWXN3b8MmRVxGcj5LJbBydIDB7XCIjl9\nbczLen1Vi/FSN+tpmU0MuVRyeRdn+PHug68gnYzO0EBo/juREa/Mdex64RLW\nzDBWcGYonrFmD7quWuzgm+f264T7fx7KALxdSuG9+ue34Tj60IAXJYQnWbgd\nXNawS6nb5LHXMo4ils+bvhhuBsnEovTb87hK4tZ3E6BaJSYn1oBcAPLGRh8N\nHiGa\r\n=ikW8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGR5iRIcWOtFrJ41JdZxadzGWrggMdDHhK8d2zesIpuPAiEA/bXl2jULNWMjS4LgycqWQxcUcIndwkKVk6daEqTBH+A="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.8-alpha.1_1584612527825_0.6502799899803666"},"_hasShrinkwrap":false},"0.21.8-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.8-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.8-alpha.2+2ac6f8b","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"2ac6f8bae872fcb2845a997bdf849cb6408ddb6f","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.8-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-rlXwCciPuHmsInPw557NzGoTd4fl+lYLwZkCPkjkL4psUaX3xeD3wbhonY1eVgGaAAi0/855CEZrYggl8U/0eA==","shasum":"d04d5d5883037509ce8936f78c0c13f48e1fd6b1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.8-alpha.2.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec0W7CRA9TVsSAnZWagAAqGoP/ijCyNKDzhGOBJ+y8GfN\nAMcwcgp8lux6VAVC4ok8FvwP2AkHGLSLp3XOTkBFuVkUsBS4+dTmH3ZvJ9bo\nl4gcr58wxs5HHvv/VM1llAoc4j+WG+joD7nGrKbNaIFrkRYsicpAC8g56gnw\n9374Rf0dZQYQnn9bYz+0UcexmjUhDIUR+q9TJs2Vya9egjLSjWnf9p9h83Fb\n8yhfG23Rnx+65fByayMVtndq5riserIyHWa8JZqOJUCZksXcUlBMqULUJjK5\nFl8j1bFigY7wd8scDk9tRteM6slmym84ojSwpPRGbAdTowNo73c6DP85yWe8\nUINroN8tYDeHcB4IpBW4UoLiTwIncBgjZiT64/JLdhThwGLlaXmdmqc89L2y\nlA4ibIET1h+bAw2VYHjsGf3RusnyHrRuMEhdu7OE7Bay4/7Hnup3rqmFUCqc\nyEdBkLcljh2sZH8Y+NttsxBkaglv54kvTJdBQK5RScTtqTeIgNz/fSU9PEoU\nlpMREf1fw5RY/Ra9oINSCZUnsXP8T1VkHc7qInmGcnOgPIRQFkDjFwoQa9Fq\n5wb42rUWO3MNdHqE0AF7Vz8fOIhXMe9IAyw9vXbktwjLtEZ9bq5FrcS2hXT3\nux4Uovq0we7k+NNMDDqJPn4mQfXx0uc1FHR0GNNHNz1niaxTTvpkPsCyYci+\nLRbl\r\n=iHBx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCAXnx0ZEMRX/htoAcpzNkgIEANEildcstXgW07NQnjlQIgOYegDKlRF7mIn8XwSvqCN1HKVEBTo4zwaR8BEQGRm1U="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.8-alpha.2_1584612790451_0.4023389217108997"},"_hasShrinkwrap":false},"0.21.8-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.21.8-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.8-alpha.3+3ee5044","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"3ee50449a40717d159d52c1ae1fc8d7d391d59ab","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.8-alpha.3","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-0QMwZk02cq7Utz9a7AETC00DruYUd0jsDhzlIL1bnMIhsoXBT7DGirRjhZ99oqFM3W2jqfrdrzNjVTPAIGI29A==","shasum":"427921d0df79be7ed73cea2ac0edc40004a32a26","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.8-alpha.3.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec0lvCRA9TVsSAnZWagAAAdcQAJVdi5OWn/x4irFXIIbk\nlMBraW+IH5JZvkSwecxYYUBGoO7tj6y1kmiXpFXQtQJnVjQxhBEbxLHX4B8p\nNMyqmk28CHmrS1HfjIrKackcUaM4AqAa1248YjWjYrfpy7YvfpQGQ/Bvvca0\nkjBHOq+LBACzJ2fqnXUs+0Kx6zG32bNVKtKCCBbLyYgofCw3wu04KU9tVOb4\nxE1V6tGFWCe/s6AUvwgqYldkvAHd0FEXjgx0kOrtztMFhzPr7Zgf6Mm1Yo1Z\nY+qzPo3+9oDAUfLbmPgneUQahFEwZWCIAHESHWhGZB9xxIL3VXEMExCjlLsq\nhr8UUXtXkKFuO9l7NVRuD76SYwL6h56WYMi4T7xFz3qoIfwO1s9baN1fcj6q\n5cdaM1y+a+T6C07XeJxM9RvLDz2OYo2w2Uc2lDH5NkVBt/YoE+gwZBJr450p\ncPBVyO1bJ2GB4Dq6r/iHWoPol/qLR0h5JfxCnVCHJAmxaGhqjcT0q63PK5a/\nzzMOuG0rWU0Q6C5cGApE5CcoTExfb6oV1TsAE2crmPSBtst5ycxfOqMw9KKt\nxdbycQABvRQdkri7ct028mdEljJbMy2AJUINfY3FCN9TUafcY45c+kMMK8wf\n8xdgceXX0wgzWVcT5AdmG9nQR06GaQx/Ll3fxCmDffbqdrcQeEUMhfy9UOar\nv7gF\r\n=sAyf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICYLtUAOvzPSfZcsIuLivlURkfDTvVDzGijRPA64yQfNAiB++IohxIdRFybgcarWMpuHerl1Xgi5XygIZ5/utVv1fQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.8-alpha.3_1584613743034_0.17142875649542133"},"_hasShrinkwrap":false},"0.21.8-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.21.8-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.8-alpha.4+93857a2","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"93857a225dc7d888f9d8db2a41a214960b384e86","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.8-alpha.4","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-0D+0ud18ZxFMWsEkj27LDtEq4JatFdy8FFCF5kgxwVIFPkZMu3m340Sg9C1jJPlVqX98XzyYVaVzt+IC09b1Qw==","shasum":"8b3c6948f298c879157727f68330fec68c7a29eb","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.8-alpha.4.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec0sgCRA9TVsSAnZWagAAp/YP/0k3TIaMETQaKQGLMiPU\nDSH52pOb9LJ2MIXXy/Gc57D9lCUhaSP8jPJV70M1tK8tWk3B8ZIRwEopHKxY\nIqdN8PBCuhrKfEo8vUg8+qogNrj0DD6pIO1UlV+Pr8FTo9WDaXP7lf/tGKym\nHmeEiJPrs7x6r2aR5vUrM/VIX0bgTkI1Ib0jL1Ae0nhsiVZ7Wpst6Qq0A5zV\nioF0HEX5V5EBmME792vHx2jaSCb53RmBI6tjc9ZXvU+ZjhoSJUKwgVSRbaW2\nqg23FUKu8eS3XUhP5mbHXPm0cmBe/+KG8cqtAMDMeTJJkbA3F9ZcZGE2i2eh\nhnovC4I1q0HeElJDo0nyWTX8D0hURFtAEn4CQ83qa7qoPyzliv2v1VOg4PJG\nFvsBre+eQupwGcJvm7GDuw6uwgkJbHRuTFktJgw35Qkx02zoPT+hV50wvfxd\nI8OxgONevJMRqZA6F24aJQilW+aPj4yYdLGDm1ciWZIpiEuA7DfwmuNNhYRk\n6yKGlH27oxy0ZT9r8bz/okOPrBNcm3XHX6zOFeWRDXzSnJTTnCkGszVOyfUN\nZriEeAiF51geiwgwftwd/eATY7QBFd/DP3mUeTGQRtfmFdTkFM03UdKDzygD\nP3cVMAurtux2EBx56IgOKUIMXsrDmPQPWtMRLWJ5frWn59fknzaS1ji42Qru\nQGqs\r\n=VIu7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHnW7IqWkmxOT3KurIeGCGXE24vm9z1CgzhaUfePH7vrAiEA+dXvrhpfURt7OfwbsVJ0E3D8UD+aNHWcEWprxd3C9wU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.8-alpha.4_1584614176051_0.6313156717828432"},"_hasShrinkwrap":false},"0.21.8-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.21.8-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.8-alpha.5+f4c628a","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"f4c628a6c48a767016de0cb019f831804a63569b","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.8-alpha.5","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-8g3Cl1FWGv523maFJk2gUQ5y810i7eV0LunzezStVzu/2/ahysQUlg+j78pgftkctobH1igbcakji1muObhLzg==","shasum":"37b7ed2647c1827f22e9aec06b335b67a347515b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.8-alpha.5.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec0vHCRA9TVsSAnZWagAAdXgP+gJNt1MDr+KAykrUgsDp\nVCsnvoLcU/ipriHXb3Sh12SsS7Llab4vAwdSSBV+VeCUtYNF+EAwnfgSq4xS\ni/N7EemlVBV/h2Ac26+wsA6GzbHT8+kYcjuBv6M0ekTHfKbo0E+nI3WsrlW7\nI8L5e6wxMjmawKNhdFsviGzC5WLCvqtMdO2A2QJrmNn4QrjZAICutBv+H4II\nmzSj80mfAMzV7BeGYUJDFC8+eo0i2ykubfoETGUi+lxsLjz9SVlQGa8sEBLl\nLaud2wh3t6f7C7Sy9kUQOC9tDkSumxm7WRPYk34FDUYO2wMR+OPZzgFZU2OS\nWyuz2WpHV8Og9aJls4ArPFxO2gIROmMSK66czHOvS9uPjYJ86VhupCwPqKqr\n6g60h0x91JHtPoXbN044HVWUANwNEWG2AJacV+kdKqiTrhye/5UuGIAG/CdL\nlH/LktTJyrhMwCO3VPVMgBJwkblKY9Bw94rViRnRJ8OJT7CqphMNo+cfTwn+\nzpZwoe7Bgli+xW0TXW4UiyitfHFjTz4/iBMucRUecJq/Up9z+76v/6DcSass\nYEw7nf6p5xiznm+SmGCbQ13VTiWKMlLNbKnDJzRzWauRX0sUKEgBMLcreaKs\nzOG7QHUhleax+2kt//2+jwLwG1q3KG79CJaasEGvUdptepZjztZTYJTxZ0by\n25lD\r\n=vxpq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDThCcDyCrBJQ2cjRMSEvtCYl5hcpAYcMVpoiMzghgHSQIhAOpV6aaiMulwiUGgtaFuIK5l7FYVYXBwWOgMzT7Aexw5"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.8-alpha.5_1584614342903_0.41750098380379264"},"_hasShrinkwrap":false},"0.21.8":{"name":"@react-ssr/nestjs-express","version":"0.21.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.8","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"7e68def8797666530b7a3614652215ed5bf92c4c","_id":"@react-ssr/nestjs-express@0.21.8","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-+gsvU5iPp/LDmYoMUZI5YzG0WInII/MeMyXB2f9YazqDZxaTpi2AiD/FN4Vqbr/RdF9T7qdbRwoLmOI0/xkOzQ==","shasum":"ebc9adc47057afb0e783a34820d3299523ab401e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.8.tgz","fileCount":8,"unpackedSize":16669,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec3MOCRA9TVsSAnZWagAA2h0P/jP3j5USZdfcMrqD0J7X\nKem6tDfRMBWvdVzkQSZx8mmxCBnwykiP6B+4c1w1xWMyPe16NxDqv0pxboPS\nnMiVzCPJBh7K92guT3VDoJBtKRkgfTXM2la15usH1kOxhaMb4gl/oQxfHylb\nzifvkQ3DM26rTih83yYxbeyMdQqFBiJ7AlDb/pFGGiHQ2QeTg5T4T3jmeQkp\nOx8MIcU6QL0yQEI2C5wUq6NrUK+vlVFTJ5NOWdxheM1zUmRA9GkjliRQaq9u\nL2QUuipknChbpa+vOUpM0bu6RIREMG07WGCaZpo+KeMZ/YJ/khaMtvu+4y8J\nZ9/69qHaakmhrz8UAhFRzMA8ws8EG/nvChf56hl847Kh6+T5D5dhkJDaEr1N\nB7Jdpg0vzYVeNc/xjWZi/mZv9xvRf/il132DYN7ELmi6Owvv8uWcTdGI+eRN\nhc5tuWS6vG0Cmh19PEzks64VJhLdviDy/nfIKRxhmPs+d/x2V+MjVXus2eBk\nByvdQXe0iOVaH2RPKqaLL0kCuSHB2KNZwjADcQgZs1d1yAmb24pNth1URgAd\nEqB+AkceeATH5rVC5gKhikojQnpqPFKXmYTkb6hkxaKjk7gStpLUDNtZ5LVj\npCU4xIqt1aYYLAT1kfUTkT4eqoO0iGdsbHHqih3irayYQWrUEmoUQMdsAnRH\nRgp3\r\n=6ZIH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDUdIF3+MM4IPHn7RvEcMhFsgBNojdpU1BkM3MCipk0qwIhAPfiRSJ8w+bbwfcxVz0N3mq1px1FqEw1BuSsljIBHVgj"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.8_1584624398485_0.8718429199288991"},"_hasShrinkwrap":false},"0.21.9-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.21.9-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.9-alpha.0+fbb8fc5","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"fbb8fc51da02a80ca09691d4aca1ed73d624234e","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.9-alpha.0","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-f6owZuVuWrbLb4XF6NvOVZewc20vr1C1uw/SxxGd55xXkVdvK5Ul2VpjoZXRPb5hsv4SoGrSeeZKyGiIG72pcA==","shasum":"b7aee4b040a3bf7fae985dbcfc7785a3ed89184c","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.9-alpha.0.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec76UCRA9TVsSAnZWagAAkccP/1x9XChJOh2bdA2/CdfT\npg4aBS8GJw7sRwhwqxNWmoqKdn6Z7KVRfwYO2SH3DyIcZ8pq9ZESDwJTAyad\n5a8ee2s/E4bcIf8uJ0esU+f6NcwMgw9Alerf99CCO+TKW9oax973KPb715uZ\nfjqN8OX9uphzXQgSPoIWztNaYTCwrLavJW3mmdZhOXsL2hFsSA5jDKpS/hBQ\n8d9K8OJwsFtmkTRSMeaquWs/H5k6XrDQ7XmZgMoqeWJNd/aBvEj4jzXr79kb\nPQ3ie7sBF9ZS36F8fP14MFtdLpkfWMb3lVN9tg/7bixs83IB7eGY6ZJ6PUWT\n2MQq/R2PQhz1ezF6GCCFv6iTU5AhqylHiz7sYGVP3vX6RwF7te5/R7F3TL9b\nX4QFnmmuJV44wfWsx2e2EDk1oOjwNzc03ZXAHVf8MbKdEhSpRHidXE/aA//R\nWUcswjGGORAQPrE62cR7WHtYhe2AKnNfmFQYQD6drJbuabJVm4z3XyaRQRSB\n5FB7KTZ38SZtDuxBIXAVEjFVqCOGYxhRJ56qtdc5U/pYT95qjshGjFFg3TjO\nEW4Sb9+QuWexzjMLu/V2VKeo4R3Cnf6Q6itbSA6ZUkjgvq7vyaemAfltz3a9\nHnZ1O1uZrfcKG4cFFaYll/HdY/bsFSb7VssGY7VVFOjwYlkMlQNK/A4bjMl9\nRWSn\r\n=1Yjp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCR9W0+I29YKsXOTfyOxbMcyc3B+wg1NznBSSHX1LnQVAIhALNm1GJTrCNqoo+Yzm8OcREq0l24q4ryJB9ecHQ+rVxg"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.9-alpha.0_1584643732293_0.4653372567310041"},"_hasShrinkwrap":false},"0.21.9-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.21.9-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.9-alpha.1+cbf966f","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"cbf966f62adde490980f43822b25d9ca43395742","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.9-alpha.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-bGDaIuATTRSg1UaBQNs4bcOkr3QjMl1XyktIC2jqwQR7oleDKUPopj9gidYtMDg+Qcw0pvM6OnBibaH9LN1kLQ==","shasum":"83878603fd1d2a41cf0e56d8bce41fc7f3cef712","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.9-alpha.1.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec78rCRA9TVsSAnZWagAA0ykP/2GUaZ2UKidKUqHFrD28\nk8DMTGt3T9ZHGNSh5zyugRfP3L7QNUmzSxSUxKto7P1X3j6tFNFbBmBbGD+2\nV/EA7/D952RyoMuQNclvtEQePFCg1NrfXIDRZlPTB5T5pt5T9wA8eRjDKf6S\nFMyXpQEatHCeiL8OLP3VOZwptjUl4tqXoN4vUvq47Jz60WYXUumR1T7rBiav\nKivmZ+wsyvXZU+5w6n/xhLvUYscj4MefQxaMSuc+cSYiYCIQDCTWmJ/bd5JS\nYjIPVqMHDFHZYmVuklJ6qn+WwbyXjDddy05dvdOkfgEwH5xN0svEH4w1jQlX\nvPLd2X5Qt6LZrHqnR5bCl34jnUwr6lap6lpDZNfG5PCOgVUNuqKjTj52SL6E\ndrZ4UPgDAhrsaOqxFPvGx+WtOCuIcpZz9QdoyTIjurw8VeSaTF49pyetxnrk\ntHk4oiVENdbp5tKPe0DydsH1u26dKQL+kC75FnON88zda+xTTSMVZgwu1nZi\nJ0WjsZ+3hLA3N2UHRSjL7Pb2OqwFMMafbzMZypwPEIElMPgYL4CEGUlvYWKV\npyvoxnlTnP8On4JqOiqwERzqY6O6KSzXi+JO8pjjCdHcto4N87fzgSkBbbXT\nHgSXCVk8lg0ijhwinF+guaJNcBaYQ3ab+nU4400GzoERGxNmd13M8dxAtuYT\n2tP+\r\n=SwGi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIA84MvmbhTwdAmcq3eGMCHjzCYR3GcxJ9CFPokPxjVmZAiATy9J+v8K6ityIhcW64IClLzDwYtU1G6QANo/aSVXIEQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.9-alpha.1_1584643883336_0.9946141564798052"},"_hasShrinkwrap":false},"0.21.9-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.9-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.9-alpha.2+339ac7a","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"339ac7a51ab629987b8842214b2cc3ba32eaab23","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.9-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-PmzReto2KRQWpektbcG3ew/ViuFn4hOYAo+ZR2xPE3BFgXYt7sEZAdc5x8AGF0wNgMOPjsXRTsvqlDqFnhmTww==","shasum":"ff396b9dc540643a32fe9674b27f167140ad7732","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.9-alpha.2.tgz","fileCount":8,"unpackedSize":16701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec8qNCRA9TVsSAnZWagAASXcP+wdjdy+4N2t9eXmrnP/E\nTHT3gzYz8SRvYyAnPEPdtYLir4IeFCQn/4cRZDzuvN2W5nEiscgmt4sXDPe4\nFCq2DiwsAyH98zEvsEK5d2i5tGM0+SqJ/z5Eia4ODNUWFonYn1+RTGiqbmBh\nNiHb97pOnZ4w81hxuTd2CK+1efgftgCMlAJ80PD6EDu+i25ancVpuHeirx8E\nC7PN78oxBvOrfZ0waaSoTZ9e0/RjOOpIINqPu/97zTSeOyqZAU330h55Ov94\n9mG/hywcry0RCLrntBxgRvb8QxSxhqdLcQJ6eKzUihrN2A2fIWVkqNNPK7dV\nhIYkZOT+Qvb61rpKEAfdGpTb6coXNo4xjiD4WIWqMTw39DWGu9frXfZ4EeKK\nPliSK9qjrWSPk+R2+VHZBE0FM2zVqgx2V3/D4dwjngkBB8nH+xFcBF17PCY5\n1w2AjH6ZkZZXftRTwAr3MiXkCYy7zySu3tQ1AI/33Suq7NxZyDHRLGSTebmm\ndlud2BYjbqMqCZf8kkyh4RxgjnP2WE6RC1Fyy1wX+0sfreY2xm1roYfyrI2Y\nPvwUfl2IqtBxTcuoulWoGMbvYwmtyUeB2TwRZbDLvO7lL/ggbVc6mOx8tYsR\neDIXx6WOtRGwG3j/j2FO8Y7zBxD9KwfT4sjMlEfmr2iTjTJYtSKX0UoVj1f5\nf+17\r\n=7/lk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAkkzNpmeezjgwPXXMzOBobUG74CsRY7fCMIpcG6focFAiBjZpNgLBpXEoMSCCrcWPZV/pBPXUAGiM3REuWtAdjd5A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.9-alpha.2_1584646797138_0.9583111083543483"},"_hasShrinkwrap":false},"0.21.9":{"name":"@react-ssr/nestjs-express","version":"0.21.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.9","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"e81beb8adc30b86e4dbff618dd4397f6efd9b88c","_id":"@react-ssr/nestjs-express@0.21.9","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-MAZABv6RPDtxgmAqV4Ck+nir5IY80mCDSUdLSwj/bYMSEkjZAYN3SWD9P6+Cmk+9vlVdN2UU9UrP2OWC0aIS4A==","shasum":"c0d6d6022f7f724cdc8e7f4ffb9303f9b4433091","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.9.tgz","fileCount":8,"unpackedSize":16669,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJec8unCRA9TVsSAnZWagAAdikP/3WuFaDWFs7xFOR+EF1V\nCb1Tu7fGhIBZmlYvrwOk3emPLH345ui1EyCQ3JS4vYNKq51rIDcLF7CR6t8o\nb5WHHysycbTNf3JhisOQyZbzgq26yAGHEiwabfE5yLNwSntlw/kjljArBMMh\nLRO09TU3yn9JW83qqaGC9MUluLL2JyA4kvRmh0gfyiXpgZ6qdadrJFA+6sqq\nSNf6BCqTWpHD8wT+DEr92B6tgoyJox5SrCCv8krzEu3SGqHsC6B7YzyD+ysV\ntq0zWGa9vD6F1H8gDgpJZ3y1hBQj6Y58+qdG51oUDro8Ej3EAfvqVaECBlpE\nT5aY3Hbu8/NhlVLxrKZcNepJ5nfujnqoPRkSC/PrRWnFunUGWDGTMd/FFVsn\n3V9nXRWrsLaMA7L0bEKRBry4mG3p9grVAsXHjOlvFFjJiJLUt6NGW82er0XG\n8XXiw660U20QvzoRveGUA4X6+WgTPxVfeADxbhkpvOKauMPYv5xksfurmkAa\nw4XM3w+rLScTfRgMjt7sRYQYSwq5oqgtgpGqAHM7OoX0W+I5I87Ttj+Xj4Pz\njR5wCanuCJZsV8Alt9GGVPQNzFYjYXKQjr2UJnLpwNhiCKz0JNKaXmNt4vfr\n2Cmj/5pGZ99y6Uh1Z7qS6C9qQ/04uCBqDXt2JnQslM7ArA1LUjxMxpJopfHv\nA+JV\r\n=zcJR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCCxfXyEa916WQgdxpxa1hMNnw0sdlJn8To0Z5yc8fuIgIga7z9JY8YnVfAWRPJbdXq4NzgBPjc743g/KTT4wU3r+Q="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.9_1584647079342_0.78450184777682"},"_hasShrinkwrap":false},"0.21.10-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.0+bb530af","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"bb530afd63e07098ba4408dab102b69fd86e053c","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.0","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-S5hGphf1tM8f+iG0F20qGJA1d8QtP34UbNex6b5C5v6TulJhVB/3UNc7xHAKIWTGLd/BJkLwZegOCGTTLuuLIA==","shasum":"8cdb657f8bfce7a35d4fb04179b92b1db4c10541","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.0.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedE+TCRA9TVsSAnZWagAAjbQP/RNyZxPRCCWKzMrOTCrV\n/bmpXssMZLxxbuR76TDUsAJBA/0StFATl8rjx4/p4S3zwUFoh+PcbxXUev7a\nXkR4jDRTjoWuZP3ydFZs7XRzFkVuxHoAmsrhPakWp3v9kCmR/HXOO85evJ+l\n+DVlsVOtXdiFU7lfNQSVSuWAJT2q5N3EbquboI7ehHtgVX353HzD6XeDRPJ6\nbscSmr5P++pTxV5IeXZh0KeQTRUCqsqGJUdT4RFGm4SkFbU0f36AISCfKLhv\nQ5Q1DYqYlOosGyMaVNcc9MHPDjNthgCfQ30y+lK54inybR0QN36aJzpBbEQV\n+dtLMEgGwXUuUhyhqyCYNakE1qROiKflGuHdVP5qwufe45+aXvg2tvULDvxn\nwbCXBQecyjfdIUmqW3D4KmtpD3YPqLCM9fRRlBSGVyAMY1/0AchduHmPr8rN\n+tiJWXbeJM1JBy1VnIYhW7ufJNnqaZMGL3VWHU5EUWGwK2WaBxUvvctSCGY/\n8emV6s40KP1lcd1R52tzaO0tu+WtJvNHIYuH4p/+tw+WVM1Jz6U9Un7O4wIW\nzMI06SKYlM895umMQqTCPDOFpEcySgczXmiO25mj3adRkrs9a0gvp1zhgPiP\nZayMwa0PhB6r5Wf9qhNghYtZ3qkoyt0Z5QN0yYRqBo8kDV0yfSsryHehG7Kx\nx61i\r\n=eeDw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICCoxTCflmR7XozfIZXZEiiiCo33x/z8N1igU+J4in7yAiEAkQHgkvgLL0mgUK+oudVoZlA7cbylRdg034o5jx+3aUs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.0_1584680850608_0.003433617880788553"},"_hasShrinkwrap":false},"0.21.10-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.1+8c163a4","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"8c163a45c4e6c69429cac869b271a770dbc84ed8","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-9ABGFVa9hNOM30R0WkFDuxeUBkIhFKR1tn0utoB5m+rCD/w9haUp/ZPapzxCtyXpw3fbUWwWsp5fw66EGtJ/Fw==","shasum":"ec1cee9322746aeae02d322844cee3dea5cb10d0","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.1.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedFDzCRA9TVsSAnZWagAAEDcP/RM3etxGED95E7X/ey3h\n4ajzbBiY0uuNIkAKwQUsIStNLu0EhaRjUFVFyKdYkTVAYyclROKLWGqbV7mf\nnjWgT8ewTF0izVU/Fx9ZJTfOSqGxMGmAXvyOxnQZ2lgtHSepsMPmpOngeb2s\nlnmUOHpnTOQSCD+sehpAFv6epXr3KIkc27rIw6DStfsyoSCf3Ep7KZTm/bCA\n6DTc/lSebklIl8atKcrc+ke+i+TR69SQYPotDcxnrlnSfskORNzAUC6LhM50\nhCICD8lqD6B4+/3wgyghK61S9XV9xM8jXKAjQbTLU8+MoApMeBhJneN5Uugo\nS2PEDmbmXtRVZtHWr9wEL+EU+D5+o7vSuvp1vCm//nNYt4JtzkK76Y/ayeOG\nGcai4fE63hHcwK0qgjp5tDkt88Fq/L3JuiTd0Zi4CHhboEpLyfrCFsN2YWVr\nV5gxRB9XVp9V9yh4Oim05guZRKT4uOizPbfcvS0WFcC/XpUzXnmecbF0ebNp\nPb1hsnpCcF2e0hHb1MhBFqUJDIMheUOBtAfYUukwhvrLMb5STzgPy2mNKLYF\nDlo9z7W6uch5VW//8J6c0FrFCdzNZFMtfTsa7O28Yav+WtoGtDVofCQiJi+6\nwmKCHMBAxZx/BvqImMqk9ljMk5OqqYT6U6bpmubMS62JxizNpqMh5MipRyyn\nLJgU\r\n=aOiz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEIzkU8T1sM5xE3TAD2jcHh5On8b8TPjAkIWDZ7undoQAiBV//LiJJniexCHfxQtYljhAEZYtxwxKbaI3fNwTI+xEQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.1_1584681202731_0.9650350284611564"},"_hasShrinkwrap":false},"0.21.10-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.2+060a13a","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"060a13aed8fb9d5f73313ca9e9aabcf920e22334","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-cIn75cWkg7i63cAaI/HhB8GA3qAlm7YQF139ebM2UYt/hhMQGFKddKGs8NkGpG9YWg1uKtJm077hdlMVRJ8Q5Q==","shasum":"cfe75d5431f26546e8a785a466218c1de1577d64","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.2.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedFJ/CRA9TVsSAnZWagAATLYQAIy3J+AlNBjgF0tcXgB9\ndq5wrTB2/n5pvXQgzRPyeb7LKeKf3Enue5ZE8KbNB5o2KFiYTonG3NOnXbqT\nNOwSREN3NCngr9gtqpElGBrzoUXS6pDsNsL6/sTsY2nLZZXc3jTGc0Qtt2tF\nYxOMEohUdNZHpb1hP2ooyP0eqvke4yeUmxtRcNN3bTCpOUT/A6ciVElyyUIE\ndDV+1GiKjRnE2x7K7vB+nf+cKUPX0HO5D0U8Mp4ZAeZXnu5KtbOIWxtDDFni\nrOXhy6XpxQMd4bCDf8xXOeftxsKklUwEO3Ex4hoZzq4fdv06W5VE+7KcoLFG\n7j8pYUj8wh3uRoWTdoRnSxMMUuAFupEyuBrEzQlam1gHb6lBZPt87B8yLCe/\nznCiUZx+40+FDGPGNm8WwIVcudvm6Z8MVOADbGIg2Ll+tNu8M7X94baYhU5k\nGJGBrhHBh10Uz9R0zKqdsxsUcOkCRSyLyg/FjJrUyU0+0GzBXUUjg6sNNxev\noHa35SjDH42WO7Nmqx4SWnB9RC7VF5QapKgdg7YpwPEHfrmo+xUo3ExC/nL+\nP76E998Gk0c/W4GPLNjrMexH8Zrj58bdacFENMjP0HY0FM/vwZLfWoFig+S2\nm0jr06+ISCoKin0scTmwlcMWNdLIUVZlE6bH2bC8rYAowG6B0NUomTwQzR58\nr+6J\r\n=0DrW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD2Y2Wus5jjBPkxQZz/1VnY/ETkmREaJn2KkGx9hPVEXQIgIddOzuKyYFBFfuV0PE2LZ60ZXt7mhHsXBPTjzcdWy4I="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.2_1584681599009_0.45627774174225566"},"_hasShrinkwrap":false},"0.21.10-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.3+0a2d23e","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"0a2d23e54d999fc6e2b4def7cdd89a21b21e476a","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.3","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-aV3awng3vhuXSL+obvRJiFMs4bjMqOri+kZNQCwitlBXpad/841VTFAUSO72V9HHImad2K3/rBlcjhJ2rDDBOg==","shasum":"71f10c7cbf81618cd184455e57a4f27ed29d8346","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.3.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedF8qCRA9TVsSAnZWagAABE8P/0pKjTH1ueGEFdxh/IZJ\n0q8AUB2pu+7+ogW7yWALcSixkM6Kw4j4KGs1KlSHF+8LcyTqUOuC6nD0GtOc\nmBt+rb2eFRzYMNSpqTTodw2UtxXL+L7xXbn8CZ5i4nCUoGF98sRnfILBtAiZ\noXIPDuRMLym//1QjF0mKYNH32hHGpgzJoLHTIgVX+piqQ5IXsJCrzOn/74OC\nS2GErEL3LTWYr3EGrvZwcPmn2U6E5l95gCVCmHLqZrq+ELrE8RGYD+ptlMmr\nqHkcx/EFuNsGWqLwwffuUSPN+Po7c5rXaV/4QYDC+B8TSqPDObKtx9Zh4nx8\n8w8WoiWz7MfteY9NPq+vOs7zV+proTt30yttQERjowyjEy4gj0Z7U7xNpOLU\nqnmdp4B/sxcZXLWFoivLKxLhhffQr9JnZX4+oyvOypq1rNRHAO1lRjNE07eD\nVNNtY9VpkFXwXGUS8JIfPgCacAbrRx12kwI+AjlRCD+3g9gEV262AcDtDjnx\n2S+FGdHsQ/lAB4Cy4IyyMzbYWpPY9FzpMhF9HM5Rcpecax84UVCKOUzpFTfy\nLaR/DzJKddRlHfA0T0WXzQo9TKx5T5gAihVSF40OxCBdVkSoGYfpoNiwqHNa\n6WIw1rv/NWa3uHjqbFatQrT0Cz1xZJitLDMV/OHjURG1ajN+xGPWX5L9JsMr\n0wEr\r\n=Mzre\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEaZx1eh7BtF/HjZHTUEXGRqg8fvuhLOufGePZa7b/uQAiEAtP4e8k+jslgD7e8fZLwuGy1cfMz7F6wh8w06Yo6i+L0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.3_1584684842052_0.7751645856727971"},"_hasShrinkwrap":false},"0.21.10-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.4+dcb3dfd","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"dcb3dfd3e56f8a2915bdfd251a361097a6eb58fc","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.4","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-5adRPeLI3Zz6vnrknqVsTmJRva18KFVSLqBiFXUauNW4hGgaVnxI01RmalQy23oyR3SucP1/ig26DvNVoJlfAA==","shasum":"9b4ff6c5fccbb0b984d5c237d75850834197b07e","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.4.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedGE4CRA9TVsSAnZWagAA1V4P/RLfdjuaiUs92+P0yu2P\nOU8CQyAZfXbwOltK9hYQAJk9K6hzO3lTLxyzLGfOxopewXM5d3NE+Beq4xAx\nODHBO5+PDQHGHK562XdGHuuKAeKuPhyMc90DW360puoVKKYECwhbO0OvOmU3\nG74i7j7SoB/WyQdVeL8v+Xe8gUzJ7oRw150ax2Ml5Lx6ISeQfW94MdrXBCCL\nTvBt1OTAfCJkMFzc1PxyjR0vx4QOhhNHCtzUX1ZwgTdZ3yEw2HB7F5O6fWJA\nJE9flu9u/ZMtohewIwYTOzPS/L0K/62RZh8VoKdQo7OGHuGXAbsWzpUL/IpQ\nZ3JYALHpBTSrEbVDy/e/lWh/qoC/OwDwDQK4IBLgY3lgU/GZCBTN1Ct4Zgfg\nA9HvsUccbuic/8slzHgzBP+YowL69gSSbbs6A/oZ1PiCFwdm+Ys7RYR8HOsu\nJb5deGDUg1yMPCqjtmtegg8T1OFHvAPUGj9b7BslhMZPkRi477nsyD9PbTJy\n30Q/SjihAIf+BAWEzpSIQhTtA5Usv+SWubCKUmG8g2Oh59bAxz5aR6oEgNNR\nSC1jgdfsqM48AbJTlK+9O4WkkYvzHAYdi+rkH4nOfCwoRW1ZMX+THAOk4piw\npzGCbReLP6o+GqEUxMCHVyi6hYnxZU6VhTNqhl7FGO5OSJJaouAPIhlNHKJ5\nRMR9\r\n=SqQ6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIECVLTgqA5PzyMWN4etDoq3pJkyDqXQqJuLHR8P10IPHAiB8t5k7msM5lRr3SA4Cyuzki6jvg8O/nhBaHjmKatK58w=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.4_1584685367665_0.17311561761698058"},"_hasShrinkwrap":false},"0.21.10-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.5+68562eb","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"68562ebc042c509c095b91dab014cf36a6872337","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.5","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-XKzpOcIjoBIq2R2MYPf09y574BAK5xgxEXa5fs5Cb+/I5TkPOpONb/MSGVIFe6FbgKv5ksg3npDt5SgQbZcbHA==","shasum":"810b5463cd30bfb80dbb6e1270305561510f0874","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.5.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedGUACRA9TVsSAnZWagAA04MQAJr/2XpaMKb8DzKHK1Jn\nVraewNa2CU0vrpgXqMu9IcxdWadgDBBjbFC1SXe3ozCnTdAyYDjCMWA+jU01\nYA5RHJACV+gPwrkkGeqwtIxiWyIbf2n2RKs5RzWG/YIszrkkBcdbPFa4dbnC\nkGuGz4ECVntvNdAuaqh8MicHggbfdwUpZepg6FRK+Fi86ah8IF/gHvAchbX8\nFMmB6xm+kzVoar7CMLVqB5eBsP4oY4UNJkhqWSU2cOegJsnH5XKseBLQgpkg\nJnftWA8HNw3tVI8/pp6szBcsGqJ2QaDGYSONnFwllbJjGJREMNix5kkbUo6n\n5szSK8Oh4g5+TLsHWRdFXCUilOGLQTNxJH2+kavNNPlUu1r/pgxIbNS+kBgk\nLnKhwAtHtlnK383QRa1Jr1gNUYBJfAr8WOd+pbPe0xWDE9iThwVwrIPa3R+K\nTs415CuJrMzXvvyadG7LLBn+Q81Fdbg/USq42I6nKUpY4/5b48LrTB7lcZUL\nk3VNp3GODsZ1Nz84XSJ8GhJIiHbLJlSTzi9KQBXfaw0SqQAjxR8KGybCRLkJ\nGTlNu2S2mvLe1QP+/57qKtrXR/GyRSPxzc4htWLk5o3YLU+X35+XfcWJQrdT\ngezlhwgSuWQTv/r7kZ97mrfs30oziWCCPn3alFqDwou1qe13+vIL8UPDTEkk\nDpf6\r\n=XBl3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDFvTg/6wQHPko6h73N2nrf/Ds3bUFwx5fqQvGkn61rdwIhAIgF7fod3LcV7JFRCvDquLMVliehJYeONoHA08nJq2WR"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.5_1584686336132_0.6617224004860245"},"_hasShrinkwrap":false},"0.21.10-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.6+7cc2c8e","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"7cc2c8ee99af48dba0bb034bda1f162584c7a265","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.6","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-iPULqTnAWE1OT4zQ95b8AqBie8pEOvF6Y42jNQDQB2XzYsVFXHixjW0KpfZSjJqgKbDWXAsowEr1spdXECEvRw==","shasum":"9df7d4edf34d13dc918e996041735a61484a1620","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.6.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedGmOCRA9TVsSAnZWagAA2ewQAJ72fx+q3kwAX3nCe26E\nmriwy2/wNu5SJVISczGK8GsCD7DuuzokVrlcHyeSuBunF2E1iDZYzGdT02kA\n9xN9ifhj4BGFJm5D9QfNqAsGJGz3Zbqv20FKOn+gPfERsCRAP/RoIZBgDqWa\nNbQ9r3oYh3PTk3zfk7uyx1Q8qOXU906sBBDt5hAQhxK9Rxe2Mx4PZfIuHIUj\nYiEQdl5saoe+QFDGIEqwsylrpnHOaieECGrO+XTwZng/V25nK+BiV5S4bB5q\nAXpssnwDn9xv6yebeDr4cyLLBfuv6UumykCE/Zp3J7v1mnyussofsoUZVFI/\nUi+yYEtJoRxUXFwXKirZgVywK2I01YGeHM6xpILIv7MYumeD8dIJwXqTNWoC\nadW2bDwf+f8O68w/KIsQElPdeL+6gvjD23BQoQnkXNscMoPSEWWx9BDrwDjK\n7sFTyse0uHlwBGcIyI6lvNIOjgyAfXu/164liJ0mjUrFnaM34AkgL1pgYJVI\nQWZjRmWCO7paPobU3hcqlrP8XPKWLjRz3mZNm2XtGmcfppWY6Zgz9q4NPvu7\nM62z/11SXTDDvRHisdwbR121mv5onefni6BhTpWp7HuvdH8CooKr+R+5+eKd\nxCBLoEUqvoHb8q+SYsDGOWi51TSRfjA93OlLQigvecM6WC0Gi5SK7MOB9uAP\n4VLM\r\n=nPND\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDdLXBYJulYQCTlETOtDpoZpKUecclCYUuijgQXqgSOiAIhAKeKB8RGb7z2g6OA4HH668sAPHA4hMy2PzGHO7OhrPfG"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.6_1584687502401_0.9997222747451386"},"_hasShrinkwrap":false},"0.21.10-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.7+12826a0","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"12826a00c65837fc2206162cba595dd2e1819365","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.7","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-W+v9JPxqh3emyTpLeXjRK8GIr4IToavzVeNsOWf0PY2PMYzkd72om+xWiMt2MVPiwWggJqLFwWb5eR2aKJ1gIA==","shasum":"a1126075aedc99c683799419223503ca942f9586","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.7.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedGpKCRA9TVsSAnZWagAAQrcQAJ4ICWhc1Cwm0cIkoUEy\nUvrfxJHhksFc/raqPWDJ+2sXj3DP9BAVOCJwE39izKS23zd1AtsGbftvi9Ss\njrSuSyL9baQcUB1ZisZwv+m76O5kaFwq1I5K/Ap/0izgRSxUCrrosPdH1gz6\ny+xelc4BsjpeSTWZknDtWMtVZPu3UY6LUVtXTjILP1K+DsKj3xjyXrueOkRa\nnbEjopQ6sxkQ+4Qbz+0WYzh/20xlR2zlq4/kHlIU0GAf1UmsAA2AGt9+pMup\nsDjf079VyDcPIXeQQz6JGt3YbYNqJ4Zr1I0FbeVsPI9IurvEL3UY3bW47SBo\nUaGSCX4ERtrjH0tLcrMoCzuI4li3D9wTkHHQLilrODqA6Ff3+FUFqM3WeT/r\nLgd3zoaoYuq3ELi+3UCYy6HMr72V1XJ5SxbFNntUCZRtCBll1ckNQ8jAJnfP\n8Rpg9X2InYsadFcY6uUeCTtxecsSErlOCqbFn2Dd1HDFzYlgja3+M0u8v8ud\n8DBL7CZOH5/88vt3jorzNKaHvllKSuoezeIh9pFCEULGUBe2Bi11PbvLAgIO\nnGAQvi0YUbOPJg024sBoMOG4yUReWbE+aYGMH6PPs0R3B+Qiszo98sv1UVD5\nm73fx0MjrB7lBCuYP+xrOZUu9ENgzrGUd9KW9XIHCpLMdFP2bkejBQbVTCsx\nSkdN\r\n=NuQm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCCjCwCfIdElZAJvZRbWxpqGH4RKelIMiOdNdATNCytzQIgG7YyUVcvQtwDAETLfXEXXyO8YmAk4FSGCuNL5FHx3lE="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.7_1584687690049_0.6446651368611338"},"_hasShrinkwrap":false},"0.21.10-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.8+75f67b9","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"75f67b9e8b18c8b98862f3365495282e36dc4d3a","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.8","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-Ej/lI9nCJdQkWCYDVBlLvr+JhCQUg119Tdp+9h7pAa/uCuTu9BXs4x+7lpr7jHWsTCCfxrwiWwu0K/7g0ztFVw==","shasum":"87fecb0c2397c76293575a24ea4188c3b6255371","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.8.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedHD2CRA9TVsSAnZWagAAcQQP/RXqUWd9WN7XPXXoFWzL\nvz32VcAvfbGGGo/JM+eLvFioxfat1qj2V72dRLJ2lPth6NzAOkxSPWjDE+Ms\nLa19M43EFrY2RT7qqaChj8hQ4J8TgUuaKRi9nMfOfjeZnwP4cB6sQMbsDhte\nLGi105EQiYn8wT4lzX7pPxFE1N8XD0XtaNWKadbNxzEuarG0RpVmHxurseRi\n9I2lR+d+JaUEC56DQweNlFjgnu3dxiREw/zpkcUNks+QsUgGr/FUEqK5iCp3\nVfBytcU0Q/xlEroKMrK2hX+64avdZxCqduJt+KaV2e+rG9zDNIH5A/+Udbga\nBqEbBjnxTrSq/wpmVnL1iDXok/TCdk3kTFyk+gW5Xj+qjmxpfnG4GxUXRB/l\nVKzxdJQSieg2x9jI0ajGDejsPPmo38g/u0gHcS3f6y7wOAs6VXArjBUgNthM\nYwxR3KPJZ48okSZqhnbpH6u0dQOZhHHobQ3cw3lPTLAlDliEZsJJFs2hJTAh\nGqjmsU9VwSFbJRCOjPCT0nHXCLw7TJ8qlxMZnxKXxh2kVJE/fniOz10g14aV\nMyp6L1qs9mtTo0FvDjbZmdFyK/tbxWcoWOSvEZ7yhzg9h3v+eXt0UfzpHeo9\ncHrz4QU9riGWWk7b0ZMnhXyOrn6s4osIYk+JpVSLhHVqPEGRbhOOqUIaR073\nNsB5\r\n=q03H\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDxTnA3qn7+arfb3CaESY5hvVi5b0OZwgc3+FimkxQ+KwIhAKT2Gq+/dTFz7kuOM3Mf4s/D5HsvmYW/xr0uR3JIfolr"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.8_1584689398063_0.7968953031630039"},"_hasShrinkwrap":false},"0.21.10-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.9+42bb2ab","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"42bb2ab09bdf95cbf96f0fcd53213cdd5f5bf88b","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.9","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-oI93OsSDXelb4m4818wueNmsJ6bhhXDhdsgASQErrNRBAR881G/mKLefXBiavAv5WiaPnRFXpRygGf8eECrinw==","shasum":"7703ae823698d10a4a9879ac9c1436d66cf94d71","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.9.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedHHaCRA9TVsSAnZWagAAnOQP/RLWQ7A9bJ8nnBq117Al\nSAH826sfEPzHE2EPRxeY+SLMeCdej4+GbRZ29SPHSN20kxmHcztbJ4IiuvJi\nrbzAUJG7GoPLYk1sesYN2QfFgf+qTljqfbKxR3TAjjiJpJrriVcfgotWQk2G\nSm8noSnOF2n/ZqvQTDQpurbWpOmi1c/HjcO/GRt1JOz5AIiCl2BQUKkolUQ+\ntyfqJMM8401sPrKrvTdepobOjxawjZDEEr60bfKFMcF5sCQPNda3wCB3hCqP\n02GD2h+qs+QuzTikJvQPAGai4vfV5dWEha571aCbet+2Kfm1t0/xMYT9VgqS\nzu9KNOvHWhvhOqTHcN53qAZEnp/K0ESNBVIy58A9ka5Eu/i2rBZoyC2vRfJN\n2YFKk+i4fviMuolsg++A1aplO6hreX8mpbe7rNJZSEXUAlJoRtT1lasxULoJ\npCefoBlkuuJ+Lp1xJ9u4XgZQF2CtxfUus3kDhsXqnvc0IAZcJ4pd2r2ZAlbV\ni7uvu8MPwy9cKDgIzz4otFngHxGkZxwvKXLr35RaqLRAWfcM6gDUxUW5RNqL\nX26jN27HFM8nhuhlzNUoIlZx//SjOt/pBKjyoTNcFDfXx6iQfzwNTpeB9mu1\nSmTUtep9ZNyDaoOGG133Dy6QnC4GZnsWlmsWG/NQeoMpd0nhFjKsB4bKyHJi\n6W6I\r\n=+sbM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCiqYgZqmbuIaf6srYA05Mh4+DJkoa/nRGSYfu2OOtwZwIhANk8Nj1MegchBjYX+tMjQUfeHrTjLCvQzGq8lMnI3gBL"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.9_1584689626046_0.7090074499236851"},"_hasShrinkwrap":false},"0.21.10-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.10+f51acbd","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"f51acbd6edae7791cfa9edfdfeed342c9ecefd06","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.10","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-INENGNXj5k1bW9anILx2daPAvtWoOOvBqUhT1sE7Dn6i6MVBv3tNQ81kwMayPyIu+k0vQsSMOIxERoTkRcDyBg==","shasum":"b462240b6e5b68061e272007a255b5aac9633678","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.10.tgz","fileCount":8,"unpackedSize":16705,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedHLkCRA9TVsSAnZWagAA8LQP/2dpBxNf2UNpN84p3lH0\nAcdpVXfzjYQ/b7sTko8Ss4FBEE8e3d0L2VKtuc7PtVJxTZGu7jjPW2Rz9k3l\n2ohBNubipzLaWmzX3Oeftqt49Ui0yFJbC6AK8qGJzA0Ja/9GrckXcc7QwR23\nslz75oguylDKLG2tIAIzqLpxcfiGLIPTuxACtQYDqDYjN5N7FdF7J5FzJXCV\neCjvosrZPBbaCDKT3dj/6OsY+xw2zlPs/VQpX+oEQVg9wj7LYEGIU96537zP\n8w7Od6I9wHEA+Ykm9RAVkypB9BQ6HqUC7MTWQd688WjXmvHDnHEJbfRTfQyi\nzxKqwqfQEt3v39LbtPwDQVi40McLyzLQTBJ7Pdi5jo2lDlG/WkMb/+fD31p2\nbXIA4NpQNf7uVNhOQCKvWW1ebZkiHai1myBUtV5viC8ZWyu6qGGR67X5YqxA\nLwpBU0G0/1+F2uGJkrhR3G3fv9XrG9+ipfzJhl2pwthfd7k/HCwClGoeyXOO\n5NK8VGfntJs9mxHT3cd0ENL0i8Jt4ombZQtiaQDv+ygqERy1ImMOSrCzHPuC\n6WPQJIt2XK0lqdKYsyxIJfAJz7t77xYYZn4f6BmleZFvfRxMJN5pcgBFizdx\nRnYA85uaUT80Q5rrFBLSQDVrHH3fRFgSuft7gE1uSfrA29c6bEa0GYfrjc4a\n01eH\r\n=wQ0r\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDfiCShJjJAXf/55GH4Cn1mnblXiCBThur/ls2WJ3Vd+wIhAOnsrhLcMuwgx35Pwt+TwM//uxhEdZE/331ppf64ENQV"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.10_1584689892139_0.27919111717164546"},"_hasShrinkwrap":false},"0.21.10-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.21.10-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10-alpha.11+cf4a375","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"cf4a375ea1301dff3080301b4705370dc85c95b5","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.10-alpha.11","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-dwnkQ2LPuTJMu8LqygvsJGuzAs7XiSqHUmNmCJHfb1j2fovO97mq1yHHnRnfiBoXXL/R1bylcJjd8WAD203AaA==","shasum":"3f7e3abef968808e0d92bde15ee57c4867056276","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10-alpha.11.tgz","fileCount":8,"unpackedSize":16705,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedHUICRA9TVsSAnZWagAAjosP/0OniiThQE14kbbWva/+\nyK/vYDoNJn8d9pJ6ZDZixBF5I+pZ2ctUrBdCX7c0k2zWq3otpj1Xol0CJJ9A\nWRM8ce7Xc5jjJSjueffAUguGmbNGgjlynfoHIlV73aG9LdofDG/jdLYWHghS\nS1rrT7ijNS5tyMsJCwZSsNvx7haVR13w2wjrRqkKgHcri9yqqk1hAmY1gAel\nWRFnFlCp4nRoc8n8Ubey/xSYGctbs+sVH2NDM4Q/BwFTJ3FhGosrt8SK2LuC\nIpmWf7m4+N7ga2LzFjfL9Vw29BuK4Ogiq/ZNhAAa0XbemKmKVk1cxMi8XUBb\nnucpqS59D40gW+8V0UK2Ux8QkRtGdFucASFER9SDwJjcOmpqgAtZsgmnqGtu\nEklY8hNP5utUL2Q8oFbhDvcA6Rg56XogA/i+Jy2K27FuQAnptwyz14S+iqGi\nHNUSK8XSAj7aKBwq0d2UWWJm3mVe17l/DCcYkTQY9X8dQVcyISjepcLBSByg\nsi8++yiamcZseiVyG0je3AU7ZPt8Ni1wU24yOgfltdttVbFqYsJe/GrFsyKd\n7rRgtaAwnlw9W3uSHJdNZ7K3NYtu9Q9eGf6WePz8s2qdLMT7aWQcNFBVfXfw\ncTWibcLsmyXY8GrKkr01u93FlSRIo5sDcw1eCxn+kkDEJvG/P9Nt0+5z/OsF\nnoiS\r\n=2DEf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBoy4ZwDHkfpZnKlpWL2oU+7HzqRjl2X4wj0r/rDG83PAiBjURPAWiztugEhp8cViM0wosXmoE2unCM7q3YKnB1cUA=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10-alpha.11_1584690439508_0.309392478028673"},"_hasShrinkwrap":false},"0.21.10":{"name":"@react-ssr/nestjs-express","version":"0.21.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.10","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"86b22e71a170083a3e8a04059f8dbb66afcafcd9","_id":"@react-ssr/nestjs-express@0.21.10","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-GT84CngR2aG4ZscAceAmk1PeCU8TkAlPM3cPM08s9HnZLCugDfXAOt4DOAtaI5P/beyW4JMVqNPjarfw2VG9Jg==","shasum":"5e81cd18919adf0ecc12b63ede894011943c88eb","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.10.tgz","fileCount":8,"unpackedSize":16671,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedHXECRA9TVsSAnZWagAAxmcP/1ShyIB7cDItG37fQ3Ab\nwoViOQWEel6YsgW1Ci80o0AuV4LwBz/1jerTKj3FR86S5PGMSzRxoKdrU0HE\nqm6LOkWG+vQB1mT7lTTKJ7FvJJP8Zhb5Dq0brI9xOLZJF5b0uJBkn0NcawXW\nSshq89OsmU7kxx6nKKwPTXTgcHIlxe2IyMA44qOSRkKYEQFVJBhJSXeEXII5\nGa1Ef2o5ErP16JX7KCxohBPrr3CmO//5ZRh3NJnwrp9ecUri7cH6txq8GDki\necP/tRINOTcdjY6wo1YKyn6twBwmBw2sSC/FZUVWDZwggaFigUv9VFSssoxR\nEI6XZmO3DaHb75ARL+EZ1DPDXB1yP5XNDnfN+WwTZndFiZdzrcYDzoChb6pp\nLsh6KwhDdatubH6fziBhl2ATc6Ft1Q/Y19fDlYa2F6ww61Y7PFTyZHAnhgLs\n30iaVjzzC+90nCr1y6gH9My+C6XgWPNR/yI+aV5PXVRl+yPu5IUo/CTU9/+L\n76aKeEuHEft5tR4JDRW3Ep8UtuauSz8dXAEvnw6mmmdYiwfixnyc2G2Irh67\ntoAawWrF18+NxxhHbkBXGezMbc205rC6sJvvJhFz29iC2Vx5j0sm7Juzmuqd\nBjkUXg2+bf05PT5kGGVf7srlx5c1eRYSkS0lXc9k5AQxYlpzTmAQpOkb2aam\nDXKZ\r\n=bbpx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCa8y0ULK5b9UbgTWOR17X/M0GeMN1HG217AdvGZRaTdwIhAJUCJpM2aWUgjRnLHLnEhQvYyzk9PnjIDv8ANQcowCh5"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.10_1584690627881_0.8528867001438181"},"_hasShrinkwrap":false},"0.21.11-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.21.11-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.11-alpha.0+8b23930","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"8b239306487ee0a93ab291b2d6f84471ea1cb258","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic\n  - `props`\n    - Passing the server data to the React client `props`\n    - Suitable for dynamic routes like blogging\n  - `Head` component for better SEO\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.11-alpha.0","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-SGBNok+rluWVu2W8uOkZ5zTZyapQDVBNFhw9Ty853BwC+ngLK9d34V8ckkMh0IVHT2rMovehn6aPnpZwsbRDwg==","shasum":"11a02deeb60f8f0721ce55afe3427915909e7548","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.11-alpha.0.tgz","fileCount":8,"unpackedSize":16703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedJinCRA9TVsSAnZWagAABfkP/0V5+MPH9TwmdRNQJ2nK\n6IbK8/HzVVP9QgLUOhjcvbhXx3SyriPSctw+u1uxdrRu74P7akEhANfLnulk\nD1bzdpFe63n6elFGW0wznmfiH0MfzuJNqiEyaUHUXsbSOcAfWL6cMGl9PVKG\nm80LFy97vemP8cbA4KaNdoKLMHD6kiiCwfBMrDKtYyosboo0U6wzZGKOeZPg\nIbdIsGKXyzYO6VDYQmPZQcGmakQ6MBaauaZoLrzjjgnbBT26YPWgWNXM+ils\n9GP0NRl+/FFAuAs5sanySBWgcae5+xZ8V70EJUi8M5Y6AGbm6Gs7FFQ1i2JV\nGPOkoEnKdO5Q5Jz8GqfVxiuoVWCypvodLQvR7oivynDJryn0o8lH6LQy53OX\nYkZ+xMWyo64W5Pj57sBaAC4WWuuE6KY1fXWyQ4WEUzBFBLm81E0ajxYiu+sg\n/uEhBDIBBUDDFee/bpwMqxk2JrmLhHLx/bbitp/0kxXnkp55qLL+KZbowUHU\nmQporMJgFdBd/C2CMqlvEmpD3lo5FR5xKf0k9Od5z8z0tG3RwHybgevbOI0P\n4JsliHm0MWXucK7RVTmIqCvCCfCWn9Ry2bYPq4bUcF25YGa5KciUQuSCisZJ\ncYjuHHnwpDIvQmdNcI3PiCoL542svM+ZvxNyzCqQHBxYn3nUS1zdH7c/QAq/\nD8+Z\r\n=JtmA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA+A9UlKVHBbBJHBKkLQb4TdFTTvpfNLX+M8GaoJltGYAiEAvBFUlVtfKZB2iEMAc4zA8HohoV5w+vdwf0Uii4r3nUk="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.11-alpha.0_1584699559443_0.7033115451380707"},"_hasShrinkwrap":false},"0.21.11":{"name":"@react-ssr/nestjs-express","version":"0.21.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.11","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"6f92c563eaf8124f8134e252613ec48ba3248410","_id":"@react-ssr/nestjs-express@0.21.11","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-+gVqf6/JGV1exDpevsyGfg9RG/t2UrtKKCS28MniNDVeOCUR4InsdH6K4qpmYr7VWUj2+qoqJrujwcJJ6wi21Q==","shasum":"cd5d48044dc3dfac6a512567e1ee60c5d5087325","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.11.tgz","fileCount":8,"unpackedSize":17227,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedbkECRA9TVsSAnZWagAAqWIP/iYIxolqYCwU1ZwAOEvq\nPKQRYxhv6Vni/R5bowubZjxy/wviKsze2euNiCI2W+9y6DBEZreHd+sIye9C\n6lh9ff/EFzCh2kTTywuu6JNFOJ5lwEwLiy84WdjIlAA8WDp2XUS9QXRUNcSC\nMDYWsiCyB3PQzakxEtUcOZf+rQdJpFvrXPTLDA7xI4WXLKJC5x8DbTerYnqi\nNzQrsLa5K17Xa07vlfrQEvnWRDPpWOsXUHhuX496kgM0SMn0BZxcE8Yd5W+6\ngabx25MXkc/PkfAklRAjTjDogHqXRPYXTusJzOzbRtEisgkGYCm/ZkqtdTUV\nC3Y99+lJwz62mcjbECMD7NwopoBnH6DOLt+M5mXPutsRswoaxyqHacD6+L5m\nK6qxs17YMWNapUuo09jHe/0N0Ij+5LHNqp6SuLN/fav/h7zpVJdB4UF67Oz/\nDbRI9iqJH3WVxKiRqgJNbrA4uBU7lrO+nOThn9Tll5s3UIZ7tFk4u2u8THsH\nxn6SZIq1Z/Z955zJSBW8Ul99W/+9bKTKY8DoPXfmVrGbP/7+AoD0YcGJ4cD/\n4aG3h4q3EOvD5dpesnOLXpIWCM3JbpoYEux4nTZ4U09Akbgplrhh1SXUUpMX\nrjCA4tgXwe+CtZNe9mdFHMg/9l0Lmt/J1o/oC7j6TUWGdBj8UeSXGnOwuWbA\nibGg\r\n=Bt4n\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC7quFU6kmq7AOVTm+FV4wVTF+ascyWmvUUEXkmJHGm3wIhAMYaQJZmhYHwqs+bjFWq4SiDfoDiuNjKCSu+/eYf55SB"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.11_1584773380126_0.2843635753821172"},"_hasShrinkwrap":false},"0.21.12-alpha.0":{"name":"@react-ssr/nestjs-express","version":"0.21.12-alpha.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.12-alpha.0+9c07a44","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"9c07a444758ca06b3735a3cf6dc820065f0b7795","readme":"## Overview\r\n\r\n- SSR (Server Side Rendering) as a view template engine\r\n- Dynamic\r\n  - `props`\r\n    - Passing the server data to the React client `props`\r\n    - Suitable for dynamic routes like blogging\r\n  - `Head` component for better SEO\r\n- Developer Experience\r\n  - Zero config of webpack and babel\r\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\r\n\r\n## Usage\r\n\r\nInstall it:\r\n\r\n```bash\r\n# install NestJS dependencies\r\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\r\n\r\n# install @react-ssr/nestjs-express\r\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\r\n```\r\n\r\nAnd add a script to your package.json like this:\r\n\r\n```json\r\n{\r\n  \"scripts\": {\r\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\r\n  }\r\n}\r\n```\r\n\r\nThen, populate files below inside your project:\r\n\r\n**`tsconfig.json`**:\r\n\r\n```json\r\n{\r\n  \"compilerOptions\": {\r\n    \"target\": \"esnext\",\r\n    \"module\": \"esnext\",\r\n    \"moduleResolution\": \"node\",\r\n    \"jsx\": \"preserve\",\r\n    \"lib\": [\r\n      \"dom\",\r\n      \"dom.iterable\",\r\n      \"esnext\"\r\n    ],\r\n    \"strict\": true,\r\n    \"allowJs\": true,\r\n    \"skipLibCheck\": true,\r\n    \"esModuleInterop\": true\r\n  },\r\n  \"exclude\": [\r\n    \"node_modules\",\r\n    \"ssr.config.js\",\r\n    \".ssr\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.server.json`**:\r\n\r\n```json\r\n{\r\n  \"extends\": \"./tsconfig.json\",\r\n  \"compilerOptions\": {\r\n    \"module\": \"commonjs\"\r\n  },\r\n  \"include\": [\r\n    \"server\"\r\n  ]\r\n}\r\n```\r\n\r\n**`server/main.ts`**:\r\n\r\n```ts\r\nimport { NestFactory } from '@nestjs/core';\r\nimport { NestExpressApplication } from '@nestjs/platform-express';\r\nimport register from '@react-ssr/nestjs-express/register';\r\nimport { AppModule } from './app.module';\r\n\r\n(async () => {\r\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\r\n\r\n  // register `.tsx` as a view template engine\r\n  await register(app);\r\n\r\n  app.listen(3000, async () => {\r\n    console.log(`> Ready on http://localhost:3000`);\r\n  });\r\n})();\r\n```\r\n\r\n**`server/app.module.ts`**:\r\n\r\n```ts\r\nimport { Module } from '@nestjs/common';\r\nimport { AppController } from './app.controller';\r\n\r\n@Module({\r\n  controllers: [\r\n    AppController,\r\n  ],\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n**`server/app.controller.ts`**:\r\n\r\n```ts\r\nimport {\r\n  Controller,\r\n  Get,\r\n  Render,\r\n} from '@nestjs/common';\r\n\r\n@Controller()\r\nexport class AppController {\r\n  @Get()\r\n  @Render('index') // this will render `views/index.tsx`\r\n  public showHome() {\r\n    const user = { name: 'NestJS' };\r\n    return { user };\r\n  }\r\n}\r\n```\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\ninterface IndexProps {\r\n  user: any;\r\n}\r\n\r\nconst Index = ({ user }: IndexProps) => {\r\n  return <p>Hello {user.name}!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\r\n\r\n## Configuration (`ssr.config.js`)\r\n\r\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'default',\r\n  distDir: '.ssr',\r\n  viewsDir: 'views',\r\n  staticViews: [],\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n### `ssr.config.js#id`\r\n\r\nThe id of **UI framework**. (default: `default`)\r\n\r\nIt can be ignored only when the project does not use any UI frameworks.\r\n\r\nSupported UI frameworks are:\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'emotion',\r\n};\r\n```\r\n\r\n### `ssr.config.js#distDir`\r\n\r\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\r\n\r\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\r\n\r\n```js\r\nmodule.exports = {\r\n  // dist folder should be ignored by `.gitignore`\r\n  distDir: 'dist/.ssr',\r\n};\r\n```\r\n\r\n### `ssr.config.js#viewsDir`\r\n\r\nThe place where we put views. (default: `views`)\r\n\r\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\r\n\r\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n\r\n### `ssr.config.js#staticViews`\r\n\r\nIf specified, `react-ssr` generates html cache when production:\r\n\r\n```js\r\nmodule.exports = {\r\n  staticViews: [\r\n    'auth/login',\r\n    'auth/register',\r\n    'about',\r\n  ],\r\n};\r\n```\r\n\r\n### `ssr.config.js#webpack()`\r\n\r\n```js\r\nmodule.exports = {\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    // we can override default webpack config here\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n## Custom Babel Config\r\n\r\nWe can extends its default `.babelrc` like this:\r\n\r\n**`.babelrc`**:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/nestjs-express/babel\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\r\n\r\n## Custom Document\r\n\r\nJust put `_document.tsx` into the views root:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/nestjs-express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html lang=\"en\">\r\n        <Head>\r\n          <title>Default Title</title>\r\n          <meta charSet=\"utf-8\" />\r\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\r\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n};\r\n```\r\n\r\n**Note**:\r\n\r\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\r\n\r\nAnd then, use it as always:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nconst Index = (props) => {\r\n  return <p>Hello World!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n\r\n## Dynamic `Head`\r\n\r\nWe can use the `Head` component in any pages:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { Head } from '@react-ssr/nestjs-express';\r\n\r\nconst Index = (props) => {\r\n  return (\r\n    <React.Fragment>\r\n      <Head>\r\n        <title>Dynamic Title</title>\r\n        <meta name=\"description\" content=\"Dynamic Description\" />\r\n      </Head>\r\n      <p>Of course, SSR Ready!</p>\r\n    </React.Fragment>\r\n  );\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n\r\n## Supported UI Framework\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\n### Non CSS-in-JS framework\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\r\n\r\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\r\n\r\nAll we have to do is to load global CSS in `_document` or each page:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html>\r\n        <Head>\r\n          <title>A Sample of Semantic UI React</title>\r\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n}\r\n```\r\n\r\n### With Ant Design\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    [\r\n      \"import\",\r\n      {\r\n        \"libraryName\": \"antd\",\r\n        \"style\": \"css\"\r\n      }\r\n    ]\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n\r\n### With Emotion\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\r\n\r\nIn order to enable SSR, we must install these packages:\r\n\r\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\r\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\r\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"emotion\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n\r\n### With Material UI\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\r\n\r\nWe can use [material-ui](https://material-ui.com) without extra configuration.\r\n\r\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n\r\n### With styled-components\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"styled-components\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n\r\n## Examples\r\n\r\n- **@react-ssr/express**\r\n  - `.jsx`\r\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\r\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\r\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\r\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\r\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\r\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\r\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\r\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\r\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n  - `.tsx`\r\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\r\n- **@react-ssr/nestjs-express**\r\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\r\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\r\n- **@react-ssr/static**\r\n  - `.jsx`\r\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\r\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\r\n  - `.tsx`\r\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\r\n\r\n## Starters\r\n\r\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\r\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\r\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\r\n\r\n## Articles\r\n\r\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\r\n\r\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\r\n\r\n## Related\r\n\r\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\r\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.12-alpha.0","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-ahHqQYaGYeQr/nNop2EeXisJIKWgEajNlfS8hwoPPALZlz9v0NIZLdYPPiMDJtk3nXb7khHynasc0emOybetaA==","shasum":"b028fa2f00118369774a057b40367612533ebc41","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.12-alpha.0.tgz","fileCount":8,"unpackedSize":17259,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedbqMCRA9TVsSAnZWagAABosP/2g0L78+kOh/y2611IQW\nitUQ8Y7ZfJtqy9Ef5ApLJrnlKcTPu2cGGfPLU37ZGuj0ZSO2bagNp+plJ7g1\nDPeHWg8ZpuBG2xhBgRhgfwnwQFMMuv0pKjTRTVHaYYOqPRvb+UOFmvLAruH1\nrKwh9CNvlAv9Tkk02fk2sJhzBsAHa6e76q+AAzuFcULTwfj6sBrVOyTmGG5h\n2P/V6B8OMTrmGHVoP0Sew3L3U82sNZ/gD69PwXSw1MX6ZavRXYQ8h8ZoxWYN\n1HtdIi+E0G8owhjg7hyUtzHCwsOpZaNaSPIdd72n1L4HqZxNykANd5capsAS\n/421U/qmZkr5ijqrLZCxB+mBZyB8IIFuscTR46adv0qrq7Ok5qztyZScJOXT\nzCdxLAxT42cPwEb6IQS46AmaDjae1+DNvtW9Vl5Brk8eLBvXgNup3XL6ll1m\nXqjwS5iOzXHwZbwYzEr721xcjsyF3xSUkscayofbqbLVfEm9Ym/x8YQyCKlD\nz/thKFS7FcBBhtVT6ebwFtJvHiWEdpPnAiJfKjqbITqJzvwRTNhksRsyDs1i\nkmYznU3rNbwaNamO65VRFAI012EWMlHc8q411/ZTKciXemo1M14+n+hCbjNG\nHR33DrQ5dNl9m4x5iv/dEj6ll27+Spu303ZvUTNHE5fctZ6o+4a87j7+Ot2c\nnZbN\r\n=ZTjZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCVwXEBdzyUGy97dZX2g5Mk7y8MngC3WQDbrWlFoTcBUwIgDdY3fqctE6PIYQHn/sb7vQuFZkBROseKUcYNZdL7hQ0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.12-alpha.0_1584773772418_0.5277797183919364"},"_hasShrinkwrap":false},"0.21.12-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.21.12-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.12-alpha.1+21f14f8","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"21f14f84761179cf8ab185cef98037999ac6a654","readme":"## Overview\r\n\r\n- SSR (Server Side Rendering) as a view template engine\r\n- Dynamic\r\n  - `props`\r\n    - Passing the server data to the React client `props`\r\n    - Suitable for dynamic routes like blogging\r\n  - `Head` component for better SEO\r\n- Developer Experience\r\n  - Zero config of webpack and babel\r\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\r\n\r\n## Usage\r\n\r\nInstall it:\r\n\r\n```bash\r\n# install NestJS dependencies\r\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\r\n\r\n# install @react-ssr/nestjs-express\r\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\r\n```\r\n\r\nAnd add a script to your package.json like this:\r\n\r\n```json\r\n{\r\n  \"scripts\": {\r\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\r\n  }\r\n}\r\n```\r\n\r\nThen, populate files below inside your project:\r\n\r\n**`tsconfig.json`**:\r\n\r\n```json\r\n{\r\n  \"compilerOptions\": {\r\n    \"target\": \"esnext\",\r\n    \"module\": \"esnext\",\r\n    \"moduleResolution\": \"node\",\r\n    \"jsx\": \"preserve\",\r\n    \"lib\": [\r\n      \"dom\",\r\n      \"dom.iterable\",\r\n      \"esnext\"\r\n    ],\r\n    \"strict\": true,\r\n    \"allowJs\": true,\r\n    \"skipLibCheck\": true,\r\n    \"esModuleInterop\": true\r\n  },\r\n  \"exclude\": [\r\n    \"node_modules\",\r\n    \"ssr.config.js\",\r\n    \".ssr\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.server.json`**:\r\n\r\n```json\r\n{\r\n  \"extends\": \"./tsconfig.json\",\r\n  \"compilerOptions\": {\r\n    \"module\": \"commonjs\"\r\n  },\r\n  \"include\": [\r\n    \"server\"\r\n  ]\r\n}\r\n```\r\n\r\n**`server/main.ts`**:\r\n\r\n```ts\r\nimport { NestFactory } from '@nestjs/core';\r\nimport { NestExpressApplication } from '@nestjs/platform-express';\r\nimport register from '@react-ssr/nestjs-express/register';\r\nimport { AppModule } from './app.module';\r\n\r\n(async () => {\r\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\r\n\r\n  // register `.tsx` as a view template engine\r\n  await register(app);\r\n\r\n  app.listen(3000, async () => {\r\n    console.log(`> Ready on http://localhost:3000`);\r\n  });\r\n})();\r\n```\r\n\r\n**`server/app.module.ts`**:\r\n\r\n```ts\r\nimport { Module } from '@nestjs/common';\r\nimport { AppController } from './app.controller';\r\n\r\n@Module({\r\n  controllers: [\r\n    AppController,\r\n  ],\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n**`server/app.controller.ts`**:\r\n\r\n```ts\r\nimport {\r\n  Controller,\r\n  Get,\r\n  Render,\r\n} from '@nestjs/common';\r\n\r\n@Controller()\r\nexport class AppController {\r\n  @Get()\r\n  @Render('index') // this will render `views/index.tsx`\r\n  public showHome() {\r\n    const user = { name: 'NestJS' };\r\n    return { user };\r\n  }\r\n}\r\n```\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\ninterface IndexProps {\r\n  user: any;\r\n}\r\n\r\nconst Index = ({ user }: IndexProps) => {\r\n  return <p>Hello {user.name}!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\r\n\r\n## Configuration (`ssr.config.js`)\r\n\r\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'default',\r\n  distDir: '.ssr',\r\n  viewsDir: 'views',\r\n  staticViews: [],\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n### `ssr.config.js#id`\r\n\r\nThe id of **UI framework**. (default: `default`)\r\n\r\nIt can be ignored only when the project does not use any UI frameworks.\r\n\r\nSupported UI frameworks are:\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'emotion',\r\n};\r\n```\r\n\r\n### `ssr.config.js#distDir`\r\n\r\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\r\n\r\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\r\n\r\n```js\r\nmodule.exports = {\r\n  // dist folder should be ignored by `.gitignore`\r\n  distDir: 'dist/.ssr',\r\n};\r\n```\r\n\r\n### `ssr.config.js#viewsDir`\r\n\r\nThe place where we put views. (default: `views`)\r\n\r\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\r\n\r\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n\r\n### `ssr.config.js#staticViews`\r\n\r\nIf specified, `react-ssr` generates html cache when production:\r\n\r\n```js\r\nmodule.exports = {\r\n  staticViews: [\r\n    'auth/login',\r\n    'auth/register',\r\n    'about',\r\n  ],\r\n};\r\n```\r\n\r\n### `ssr.config.js#webpack()`\r\n\r\n```js\r\nmodule.exports = {\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    // we can override default webpack config here\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n## Custom Babel Config\r\n\r\nWe can extends its default `.babelrc` like this:\r\n\r\n**`.babelrc`**:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/nestjs-express/babel\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\r\n\r\n## Custom Document\r\n\r\nJust put `_document.tsx` into the views root:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/nestjs-express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html lang=\"en\">\r\n        <Head>\r\n          <title>Default Title</title>\r\n          <meta charSet=\"utf-8\" />\r\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\r\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n};\r\n```\r\n\r\n**Note**:\r\n\r\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\r\n\r\nAnd then, use it as always:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nconst Index = (props) => {\r\n  return <p>Hello World!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n\r\n## Dynamic `Head`\r\n\r\nWe can use the `Head` component in any pages:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { Head } from '@react-ssr/nestjs-express';\r\n\r\nconst Index = (props) => {\r\n  return (\r\n    <React.Fragment>\r\n      <Head>\r\n        <title>Dynamic Title</title>\r\n        <meta name=\"description\" content=\"Dynamic Description\" />\r\n      </Head>\r\n      <p>Of course, SSR Ready!</p>\r\n    </React.Fragment>\r\n  );\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n\r\n## Supported UI Framework\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\n### Non CSS-in-JS framework\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\r\n\r\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\r\n\r\nAll we have to do is to load global CSS in `_document` or each page:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html>\r\n        <Head>\r\n          <title>A Sample of Semantic UI React</title>\r\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n}\r\n```\r\n\r\n### With Ant Design\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    [\r\n      \"import\",\r\n      {\r\n        \"libraryName\": \"antd\",\r\n        \"style\": \"css\"\r\n      }\r\n    ]\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n\r\n### With Emotion\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\r\n\r\nIn order to enable SSR, we must install these packages:\r\n\r\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\r\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\r\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"emotion\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n\r\n### With Material UI\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\r\n\r\nWe can use [material-ui](https://material-ui.com) without extra configuration.\r\n\r\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n\r\n### With styled-components\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"styled-components\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n\r\n## Examples\r\n\r\n- **@react-ssr/express**\r\n  - `.jsx`\r\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\r\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\r\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\r\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\r\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\r\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\r\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\r\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\r\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n  - `.tsx`\r\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\r\n- **@react-ssr/nestjs-express**\r\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\r\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\r\n- **@react-ssr/static**\r\n  - `.jsx`\r\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\r\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\r\n  - `.tsx`\r\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\r\n\r\n## Starters\r\n\r\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\r\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\r\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\r\n\r\n## Articles\r\n\r\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\r\n\r\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\r\n\r\n## Related\r\n\r\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\r\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.12-alpha.1","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-Y7S9BxIbU7x86dQDugw4d+64bj4lm4STVQqoRs+8QuMsErVo5c7fW8wAKZrlpFOAiR7LlSH5PPbZ3imLRT58pg==","shasum":"9b4b1fca17483ae92708411354397bb229c41111","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.12-alpha.1.tgz","fileCount":8,"unpackedSize":17259,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedbvhCRA9TVsSAnZWagAABVQP/iQFn7NowXGjIJcfUILV\nCuA0K0P6E+y2vJNnlpm3yj46AQXCZFOwaT+DZ3S3ga+vEc5gKKUwIDCqxisQ\nCS7GcdUjUxF1Z/5HF2YWBGFbTYHMZyiLjhKHhokbTi6dpnCIuQY1xdROpv0R\nMWvggkvC7mBCUoYj4DjC7mqA1Uk0M+iiK/1cv3+lxfWajdhyRIno/KFQiRiO\n7yGn9MX2gAXycXGc7jHn4UlA4pjQehpQUnc2GCbXx3O0Zq0jNO4nKn2xBJAE\n1bUtrTeexfJbVYpMVB/3ju0NzXSh/+x3jUwOvkqaOZicP//4wjmyLE2qTXYm\nSvGny1sPxMJK9wk2ZZ0eZyI5rj3cO++yCRN0h2+UMP0XbKGUItgbGxudO77s\nxJ1cx3E9DqY4EZ7FqBemhCD7iEINW67zA9IxwXey9CygzQ2yic2cpmGuZYTg\nSkMna6XPVW5SNG8ZuvQZ7HqfkB62TQ4+oz1f4Y8kjVHUDOERdcXpGme4NCrb\nKgQKU3knp1zDwaHW80BbWNv4RlSlk3TFHVKcc5/sq0dt41J1OvdljZBC75WI\nGm1Zi+ZiTK298oUUO2nCIyiobckGf0ieEnYrRvlyCCU52LrNganBiU0sUj88\ncDnFSchESv8Wmwj5iHbMdHnrgYf37urOuVZijk0pCOW2hVz8WYX1OIJCYnGG\n8tdN\r\n=OqAt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDAB2wtUVYTaT1PnOVc1Qj53hCGDt9dL4QskmzHsE3p+AIhAOsT8eZjv1DxnM825x7e89QO9VRmEZBIwMvu1uWSrfJ1"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.12-alpha.1_1584774112746_0.9121157382310132"},"_hasShrinkwrap":false},"0.21.12-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.12-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.12-alpha.2+7aec641","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"7aec641f77d0c0c311091276dcf6d76a40ab68a0","readme":"## Overview\r\n\r\n- SSR (Server Side Rendering) as a view template engine\r\n- Dynamic\r\n  - `props`\r\n    - Passing the server data to the React client `props`\r\n    - Suitable for dynamic routes like blogging\r\n  - `Head` component for better SEO\r\n- Developer Experience\r\n  - Zero config of webpack and babel\r\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\r\n\r\n## Usage\r\n\r\nInstall it:\r\n\r\n```bash\r\n# install NestJS dependencies\r\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\r\n\r\n# install @react-ssr/nestjs-express\r\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\r\n```\r\n\r\nAnd add a script to your package.json like this:\r\n\r\n```json\r\n{\r\n  \"scripts\": {\r\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\r\n  }\r\n}\r\n```\r\n\r\nThen, populate files below inside your project:\r\n\r\n**`tsconfig.json`**:\r\n\r\n```json\r\n{\r\n  \"compilerOptions\": {\r\n    \"target\": \"esnext\",\r\n    \"module\": \"esnext\",\r\n    \"moduleResolution\": \"node\",\r\n    \"jsx\": \"preserve\",\r\n    \"lib\": [\r\n      \"dom\",\r\n      \"dom.iterable\",\r\n      \"esnext\"\r\n    ],\r\n    \"strict\": true,\r\n    \"allowJs\": true,\r\n    \"skipLibCheck\": true,\r\n    \"esModuleInterop\": true\r\n  },\r\n  \"exclude\": [\r\n    \"node_modules\",\r\n    \"ssr.config.js\",\r\n    \".ssr\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.server.json`**:\r\n\r\n```json\r\n{\r\n  \"extends\": \"./tsconfig.json\",\r\n  \"compilerOptions\": {\r\n    \"module\": \"commonjs\"\r\n  },\r\n  \"include\": [\r\n    \"server\"\r\n  ]\r\n}\r\n```\r\n\r\n**`server/main.ts`**:\r\n\r\n```ts\r\nimport { NestFactory } from '@nestjs/core';\r\nimport { NestExpressApplication } from '@nestjs/platform-express';\r\nimport register from '@react-ssr/nestjs-express/register';\r\nimport { AppModule } from './app.module';\r\n\r\n(async () => {\r\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\r\n\r\n  // register `.tsx` as a view template engine\r\n  await register(app);\r\n\r\n  app.listen(3000, async () => {\r\n    console.log(`> Ready on http://localhost:3000`);\r\n  });\r\n})();\r\n```\r\n\r\n**`server/app.module.ts`**:\r\n\r\n```ts\r\nimport { Module } from '@nestjs/common';\r\nimport { AppController } from './app.controller';\r\n\r\n@Module({\r\n  controllers: [\r\n    AppController,\r\n  ],\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n**`server/app.controller.ts`**:\r\n\r\n```ts\r\nimport {\r\n  Controller,\r\n  Get,\r\n  Render,\r\n} from '@nestjs/common';\r\n\r\n@Controller()\r\nexport class AppController {\r\n  @Get()\r\n  @Render('index') // this will render `views/index.tsx`\r\n  public showHome() {\r\n    const user = { name: 'NestJS' };\r\n    return { user };\r\n  }\r\n}\r\n```\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\ninterface IndexProps {\r\n  user: any;\r\n}\r\n\r\nconst Index = ({ user }: IndexProps) => {\r\n  return <p>Hello {user.name}!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\r\n\r\n## Configuration (`ssr.config.js`)\r\n\r\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'default',\r\n  distDir: '.ssr',\r\n  viewsDir: 'views',\r\n  staticViews: [],\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n### `ssr.config.js#id`\r\n\r\nThe id of **UI framework**. (default: `default`)\r\n\r\nIt can be ignored only when the project does not use any UI frameworks.\r\n\r\nSupported UI frameworks are:\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'emotion',\r\n};\r\n```\r\n\r\n### `ssr.config.js#distDir`\r\n\r\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\r\n\r\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\r\n\r\n```js\r\nmodule.exports = {\r\n  // dist folder should be ignored by `.gitignore`\r\n  distDir: 'dist/.ssr',\r\n};\r\n```\r\n\r\n### `ssr.config.js#viewsDir`\r\n\r\nThe place where we put views. (default: `views`)\r\n\r\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\r\n\r\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n\r\n### `ssr.config.js#staticViews`\r\n\r\nIf specified, `react-ssr` generates html cache when production:\r\n\r\n```js\r\nmodule.exports = {\r\n  staticViews: [\r\n    'auth/login',\r\n    'auth/register',\r\n    'about',\r\n  ],\r\n};\r\n```\r\n\r\n### `ssr.config.js#webpack()`\r\n\r\n```js\r\nmodule.exports = {\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    // we can override default webpack config here\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n## Custom Babel Config\r\n\r\nWe can extends its default `.babelrc` like this:\r\n\r\n**`.babelrc`**:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/nestjs-express/babel\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\r\n\r\n## Custom Document\r\n\r\nJust put `_document.tsx` into the views root:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/nestjs-express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html lang=\"en\">\r\n        <Head>\r\n          <title>Default Title</title>\r\n          <meta charSet=\"utf-8\" />\r\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\r\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n};\r\n```\r\n\r\n**Note**:\r\n\r\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\r\n\r\nAnd then, use it as always:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nconst Index = (props) => {\r\n  return <p>Hello World!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n\r\n## Dynamic `Head`\r\n\r\nWe can use the `Head` component in any pages:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { Head } from '@react-ssr/nestjs-express';\r\n\r\nconst Index = (props) => {\r\n  return (\r\n    <React.Fragment>\r\n      <Head>\r\n        <title>Dynamic Title</title>\r\n        <meta name=\"description\" content=\"Dynamic Description\" />\r\n      </Head>\r\n      <p>Of course, SSR Ready!</p>\r\n    </React.Fragment>\r\n  );\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n\r\n## Supported UI Framework\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\n### Non CSS-in-JS framework\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\r\n\r\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\r\n\r\nAll we have to do is to load global CSS in `_document` or each page:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html>\r\n        <Head>\r\n          <title>A Sample of Semantic UI React</title>\r\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n}\r\n```\r\n\r\n### With Ant Design\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    [\r\n      \"import\",\r\n      {\r\n        \"libraryName\": \"antd\",\r\n        \"style\": \"css\"\r\n      }\r\n    ]\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n\r\n### With Emotion\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\r\n\r\nIn order to enable SSR, we must install these packages:\r\n\r\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\r\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\r\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"emotion\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n\r\n### With Material UI\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\r\n\r\nWe can use [material-ui](https://material-ui.com) without extra configuration.\r\n\r\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n\r\n### With styled-components\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"styled-components\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n\r\n## Examples\r\n\r\n- **@react-ssr/express**\r\n  - `.jsx`\r\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\r\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\r\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\r\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\r\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\r\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\r\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\r\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\r\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n  - `.tsx`\r\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\r\n- **@react-ssr/nestjs-express**\r\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\r\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\r\n- **@react-ssr/static**\r\n  - `.jsx`\r\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\r\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\r\n  - `.tsx`\r\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\r\n\r\n## Starters\r\n\r\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\r\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\r\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\r\n\r\n## Articles\r\n\r\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\r\n\r\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\r\n\r\n## Related\r\n\r\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\r\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.12-alpha.2","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-jRHyyDItPtZateELUlotWsCvb3Cq9qcXGz+/u5iWxp6GBfCptg0f9Ky66FyX5v0pjs8hcsjSm4at1RDYN8I63A==","shasum":"d506379c6b333c0879b9b4d17b118f81405a0d6d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.12-alpha.2.tgz","fileCount":8,"unpackedSize":17259,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedbxvCRA9TVsSAnZWagAAO7IP/2Jgt8xxq8JGqHXxuZpe\nNFa6P1zVHk8D3osfr34Xu6HfWukojP+KYwE7+7m/1/9HlMvUj06D/rhBqEa8\nbv4V4dV47gK5Baydb1BOBI8XU+G/lMD9njnb++hQZyWkoE1g6IgD7eiXrWBz\nYOjgXU6yDCrxRpIceHrF3jQLDzysesQhd2QEoR6hTmo6do34Cs5EAeASbu/h\nBCoB31EHoVufTMXCkDLxqad9EnLyvj6h7czQX8g18cWEK41pfo7iPqzt+N3k\nvNSX8mFMsJ7jvc3r3zW8msYm6dMtMzcSzH15jeh/cU1MY3VEaxp/mTOOps9k\nknyD0u7967SjmF1fHYVE7NrXCdgiSOZ5ERRkCnAdsO4irAeKwrhMe+j6Re1i\nIQQwNpAaeJd9jXwlYn3ZoFCE4ZusXrCRnRUx2UV216nLUtZHXZNgCxYQlqjl\n8wO9Nlf6JLO87ITG97oe0uOS3ZLT2kjcWpZi5U1etQA/5rz5LTF9d/Vn6EIR\nSTxz+pTIIkH4wxC1phiySxQzXPbVi06n9y6xbGSGdibnWI4EzT8tnWMUyQB1\nbciss2e3ghu47ok1pPo8KgCbS1/Q6pZIQv/bc+FSdw5/a8GgD9S2ij3Zy692\nYFjFStsBh7sh1AnLObpKSZ/o084N8dPgdhv1WhF4Fg7dRfldsIvQTq8wzLSm\nC/PQ\r\n=yw37\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCCuuA7Il57+BGp5sy2XQb9vSSXweCtTiU3ZU4zu6V0nQIgBy/ekCZTYNENTwawxbu6+muWelAEoFI1aGkN7Oibvh8="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.12-alpha.2_1584774254865_0.24529803177087328"},"_hasShrinkwrap":false},"0.21.12-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.21.12-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.12-alpha.3+9cdffab","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"9cdffab9311b6bb05e45c585a8014812c6b5d80a","readme":"## Overview\r\n\r\n- SSR (Server Side Rendering) as a view template engine\r\n- Dynamic\r\n  - `props`\r\n    - Passing the server data to the React client `props`\r\n    - Suitable for dynamic routes like blogging\r\n  - `Head` component for better SEO\r\n- Developer Experience\r\n  - Zero config of webpack and babel\r\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\r\n\r\n## Usage\r\n\r\nInstall it:\r\n\r\n```bash\r\n# install NestJS dependencies\r\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express\r\n\r\n# install @react-ssr/nestjs-express\r\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\r\n```\r\n\r\nAnd add a script to your package.json like this:\r\n\r\n```json\r\n{\r\n  \"scripts\": {\r\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\r\n  }\r\n}\r\n```\r\n\r\nThen, populate files below inside your project:\r\n\r\n**`tsconfig.json`**:\r\n\r\n```json\r\n{\r\n  \"compilerOptions\": {\r\n    \"target\": \"esnext\",\r\n    \"module\": \"esnext\",\r\n    \"moduleResolution\": \"node\",\r\n    \"jsx\": \"preserve\",\r\n    \"lib\": [\r\n      \"dom\",\r\n      \"dom.iterable\",\r\n      \"esnext\"\r\n    ],\r\n    \"strict\": true,\r\n    \"allowJs\": true,\r\n    \"skipLibCheck\": true,\r\n    \"esModuleInterop\": true\r\n  },\r\n  \"exclude\": [\r\n    \"node_modules\",\r\n    \"ssr.config.js\",\r\n    \".ssr\"\r\n  ]\r\n}\r\n```\r\n\r\n**`tsconfig.server.json`**:\r\n\r\n```json\r\n{\r\n  \"extends\": \"./tsconfig.json\",\r\n  \"compilerOptions\": {\r\n    \"module\": \"commonjs\"\r\n  },\r\n  \"include\": [\r\n    \"server\"\r\n  ]\r\n}\r\n```\r\n\r\n**`server/main.ts`**:\r\n\r\n```ts\r\nimport { NestFactory } from '@nestjs/core';\r\nimport { NestExpressApplication } from '@nestjs/platform-express';\r\nimport register from '@react-ssr/nestjs-express/register';\r\nimport { AppModule } from './app.module';\r\n\r\n(async () => {\r\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\r\n\r\n  // register `.tsx` as a view template engine\r\n  await register(app);\r\n\r\n  app.listen(3000, async () => {\r\n    console.log(`> Ready on http://localhost:3000`);\r\n  });\r\n})();\r\n```\r\n\r\n**`server/app.module.ts`**:\r\n\r\n```ts\r\nimport { Module } from '@nestjs/common';\r\nimport { AppController } from './app.controller';\r\n\r\n@Module({\r\n  controllers: [\r\n    AppController,\r\n  ],\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n**`server/app.controller.ts`**:\r\n\r\n```ts\r\nimport {\r\n  Controller,\r\n  Get,\r\n  Render,\r\n} from '@nestjs/common';\r\n\r\n@Controller()\r\nexport class AppController {\r\n  @Get()\r\n  @Render('index') // this will render `views/index.tsx`\r\n  public showHome() {\r\n    const user = { name: 'NestJS' };\r\n    return { user };\r\n  }\r\n}\r\n```\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\ninterface IndexProps {\r\n  user: any;\r\n}\r\n\r\nconst Index = ({ user }: IndexProps) => {\r\n  return <p>Hello {user.name}!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\r\n\r\n## Configuration (`ssr.config.js`)\r\n\r\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'default',\r\n  distDir: '.ssr',\r\n  viewsDir: 'views',\r\n  staticViews: [],\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n### `ssr.config.js#id`\r\n\r\nThe id of **UI framework**. (default: `default`)\r\n\r\nIt can be ignored only when the project does not use any UI frameworks.\r\n\r\nSupported UI frameworks are:\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\r\n\r\n```js\r\nmodule.exports = {\r\n  id: 'emotion',\r\n};\r\n```\r\n\r\n### `ssr.config.js#distDir`\r\n\r\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\r\n\r\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\r\n\r\n```js\r\nmodule.exports = {\r\n  // dist folder should be ignored by `.gitignore`\r\n  distDir: 'dist/.ssr',\r\n};\r\n```\r\n\r\n### `ssr.config.js#viewsDir`\r\n\r\nThe place where we put views. (default: `views`)\r\n\r\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\r\n\r\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n\r\n### `ssr.config.js#staticViews`\r\n\r\nIf specified, `react-ssr` generates html cache when production:\r\n\r\n```js\r\nmodule.exports = {\r\n  staticViews: [\r\n    'auth/login',\r\n    'auth/register',\r\n    'about',\r\n  ],\r\n};\r\n```\r\n\r\n### `ssr.config.js#webpack()`\r\n\r\n```js\r\nmodule.exports = {\r\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\r\n    // we can override default webpack config here\r\n    return config;\r\n  },\r\n};\r\n```\r\n\r\n## Custom Babel Config\r\n\r\nWe can extends its default `.babelrc` like this:\r\n\r\n**`.babelrc`**:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/nestjs-express/babel\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\r\n\r\n## Custom Document\r\n\r\nJust put `_document.tsx` into the views root:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/nestjs-express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html lang=\"en\">\r\n        <Head>\r\n          <title>Default Title</title>\r\n          <meta charSet=\"utf-8\" />\r\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\r\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n};\r\n```\r\n\r\n**Note**:\r\n\r\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\r\n\r\nAnd then, use it as always:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nconst Index = (props) => {\r\n  return <p>Hello World!</p>;\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n\r\n## Dynamic `Head`\r\n\r\nWe can use the `Head` component in any pages:\r\n\r\n**`views/index.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport { Head } from '@react-ssr/nestjs-express';\r\n\r\nconst Index = (props) => {\r\n  return (\r\n    <React.Fragment>\r\n      <Head>\r\n        <title>Dynamic Title</title>\r\n        <meta name=\"description\" content=\"Dynamic Description\" />\r\n      </Head>\r\n      <p>Of course, SSR Ready!</p>\r\n    </React.Fragment>\r\n  );\r\n};\r\n\r\nexport default Index;\r\n```\r\n\r\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n\r\n## Supported UI Framework\r\n\r\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\r\n  - [x] [bulma](https://bulma.io)\r\n  - [x] [semantic-ui](https://react.semantic-ui.com)\r\n  - [x] Or any other **non** CSS-in-JS UI frameworks\r\n- [x] [emotion](https://emotion.sh)\r\n- [x] [styled-components](https://www.styled-components.com)\r\n- [x] [material-ui](https://material-ui.com)\r\n- [x] [antd](https://ant.design)\r\n- [ ] and more...\r\n\r\n### Non CSS-in-JS framework\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\r\n\r\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\r\n\r\nAll we have to do is to load global CSS in `_document` or each page:\r\n\r\n**`views/_document.tsx`**:\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  Document,\r\n  Head,\r\n  Main,\r\n} from '@react-ssr/express';\r\n\r\nexport default class extends Document {\r\n  render() {\r\n    return (\r\n      <html>\r\n        <Head>\r\n          <title>A Sample of Semantic UI React</title>\r\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\r\n        </Head>\r\n        <body>\r\n          <Main />\r\n        </body>\r\n      </html>\r\n    );\r\n  }\r\n}\r\n```\r\n\r\n### With Ant Design\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    [\r\n      \"import\",\r\n      {\r\n        \"libraryName\": \"antd\",\r\n        \"style\": \"css\"\r\n      }\r\n    ]\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n\r\n### With Emotion\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\r\n\r\nIn order to enable SSR, we must install these packages:\r\n\r\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\r\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\r\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"emotion\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n\r\n### With Material UI\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\r\n\r\nWe can use [material-ui](https://material-ui.com) without extra configuration.\r\n\r\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n\r\n### With styled-components\r\n\r\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\r\n\r\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\r\n\r\nAnd then, populate `.babelrc` in your project root:\r\n\r\n```json\r\n{\r\n  \"presets\": [\r\n    \"@react-ssr/express/babel\"\r\n  ],\r\n  \"plugins\": [\r\n    \"styled-components\"\r\n  ]\r\n}\r\n```\r\n\r\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n\r\n## Examples\r\n\r\n- **@react-ssr/express**\r\n  - `.jsx`\r\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\r\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\r\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\r\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\r\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\r\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\r\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\r\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\r\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\r\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\r\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\r\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\r\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\r\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\r\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\r\n  - `.tsx`\r\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\r\n- **@react-ssr/nestjs-express**\r\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\r\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\r\n- **@react-ssr/static**\r\n  - `.jsx`\r\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\r\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\r\n  - `.tsx`\r\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\r\n\r\n## Starters\r\n\r\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\r\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\r\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\r\n\r\n## Articles\r\n\r\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\r\n\r\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\r\n\r\n## Related\r\n\r\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\r\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.12-alpha.3","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-K6P4Q2yFeU/+EuL9ffbABAVwPs1rniuHWGs5UjXgmsO/W9kP9h2Asw4J4eQ7zbQ1VdGJvaKlZDYo6gY5UkGAOQ==","shasum":"5fbf326205e3d66bed8b998e8c4e635638874aba","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.12-alpha.3.tgz","fileCount":8,"unpackedSize":17259,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedb0gCRA9TVsSAnZWagAAfiAQAJ0Bv8Vqe3VratBwUOVj\noKFnUyrw6UZ6I2spD71+nSL8EhaWoUV4tnV6EW7+ATMAaWSQtHzzXi0qD3FG\nQ6/P4UB1MgPQQHgMSH582mtK4b0IPQF/Ihh/B5rPrWfEfkZmdgy9zl63Hq4q\n9V9bJ49o5lQHRY1jwwBsyLRxcDaBgru9S/PSxL6DDRpLitSD57OFK3qm1Ssa\nQ+DqGSPle65VuQI0fQGFezaSvret48HFFlqS5/xbeZcq+FuCQnFhank9Y6xb\nyZdJsuZLjJg9kx8PerA8LHq/LH5myOfl8omYT1b0e/1dNgVqQcSKjnyEqfKY\nGd4cmctO6N9RwqpOC6VT4zMBTBjTp5aYigcZH6FdlFX3GMg2sQuCujVFwHZT\nN9HDsXXNSFMxc11TQC5WjM+srmfFq5QjrQzY9gfeVGmixj6MgB3jUMYbzVux\n1QHeSnYtkSMpB8dQkO9zDgDxNce3/YOsvsPLmZXQxPFhdvYSZCKJDEPc36yo\n1Io12HTSYxRI2ZNATsqJ0J0hPTcDl1PWIXWjK/JxJoFrYPGz0l9NeXwa55B1\nkVVeU/ZrjnxH7fce/b/Ho0b2U9u922aU3UGkrlv0PhAGgxxusLiUroEBniZa\nWGIrooVFOtTaMC0bRmjXFUQanyZajQVKrk1S6UZC/lFgSpR8eT3Seq0GVqd+\nYlkD\r\n=PdTk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH//tPIGxWmBOfg8kG9LA8eNYeHtyC21QiLRhRlkZ2s6AiEAw+acvMDtS5z5Dln6V4mfxtisrSVTN1nyEeOjU1Hu42U="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.12-alpha.3_1584774431791_0.23152347970482934"},"_hasShrinkwrap":false},"0.21.12":{"name":"@react-ssr/nestjs-express","version":"0.21.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.12","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"d146aedaf198146783f3c122a94c7f7e41f2ed2e","_id":"@react-ssr/nestjs-express@0.21.12","_nodeVersion":"12.14.1","_npmVersion":"lerna/3.20.2/node@v12.14.1+x64 (win32)","dist":{"integrity":"sha512-hPsQNVCHyyvCSerxRxTaE4Csg4V1Q0POtlUD2MYEX0q+3ebgXd220wzf0C9WwQBo0bdoE85lcd9lsgxfG14pwg==","shasum":"b113058cc9f6eee3fd41007ce1dc6da5484168ca","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.12.tgz","fileCount":8,"unpackedSize":17227,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJedb3vCRA9TVsSAnZWagAAj1EP/iJ04akkvfj5TBVQsSnt\nCkZtgQxUjFsk+cWo7NWXmfQEXpp/VD/y+w5W8H274EXa3IgWwjoxDJ5QLb3K\nlXb9rbr+f4gcgyjiGbd2pvTnq65UMWnmMU0EoO6l8zif/tJ88ypppavacR/3\nMB4P3eIR/f+ebEzvKHjEA8E3dZsJwjWH+LCltSePmU1VEX09aFqrnfEhY2wv\n9AGyYSvJb7Zei92yVRNHTqoq6TtYalHjnh5bo39lSigKR7Oo/Qf9BHUwy9Lk\nRot6GjDCNhmAkzIqlU+UaQbOUySIRHJrgXt6dGJivT4l2y0v1bmqe7Pbshr1\nz3fnUDDyCiF0Gre0cXhRf0LqJkZ+tFBq/SJCE/5KzDK9XYJ48vHwhtw9qcU/\nFBS7bIvKVi7fhpoAXUyC1yXnUDg38G0qSNhdrlKuUhTBs9Qin8mYDz/n+vEl\naQjvdlwDi3xkY9Ao6tFofjlsUVkedEsb60mjZaysG5rnfr1pWAm4BrI+EN5T\nYfrk1ogkF8j+BtSNREyYKkaFuBySxiiijoY1mXfGvyj5moDtXShfEG0++ZAO\nS4qxhYCNOT5LnWVB6UchOGZBFWngaeVosBguwn6j3ugU9Z1Y55UuwVWMMuhQ\nBV3R6wurBxaxGh6nbBorOTSdW7745+sP11/7nxk/18RDluDRljITSqdmePl0\nLGck\r\n=LDEq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGfjmJzStvsXzIJFtNxEeIErjh813lSSeVLnUxHrI6eoAiAnXlK/tTfqwXM54MEIJrd+SFoj/gvmT1yIUifuMZn05A=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.12_1584774638827_0.7471905016169311"},"_hasShrinkwrap":false},"0.21.13":{"name":"@react-ssr/nestjs-express","version":"0.21.13","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.13","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"e3d9be1eb41b8972cc79bcb16c03311b6df3344e","_id":"@react-ssr/nestjs-express@0.21.13","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-S8nOae7ZDOPiswpq13R6ZYmu4CeUjOrHeR/dri1fxhzaq93BsIfqRtl6vqEEo9hmdvPzf0pPY1g/vIX47x0eog==","shasum":"9adc326f802113ff4817bb74987e8f5ce29f1150","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.13.tgz","fileCount":8,"unpackedSize":18156,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJed7MKCRA9TVsSAnZWagAAIY0QAJNf7udsX9pqmH7yWQkl\nWWCLhvaemEJKoxQiblZuhdnDl7UanEd/cElt3AqPg3NtryMKLBlkFZpc4zaB\n8pShbErMZf0a5p/5Y2ANLbbEymC2OPYOhx0aPCm6v7LJn9sh18JKImZ4T05y\nCK2ED398odAZY90b+TmesB+gQJxdO8uRQtqUdog8eM+DIjcAkhhChGFjwbFW\nkQnlF84+8rSOgWTmMnP0TpyrwovQPC4QT2lol27QeurmZRsjYudueBhVyiKk\nkV8VIx/krczCUNdVk6ERB46utUqlAVfGuPH09S5QP015Mtox/cGYeVGAqulx\nlypwPPGUpg2YhPj0MHQyXGs3EC+sZKUHV3PCJ0CEYbTNhscv4dxHbhjGogV6\nSmBQjA6nM6URsjLoiipvF03CXEBOGJGr0/NxvganUaF9IWuFY+T6qmL8Me4G\nsFgPXpaNzLadA/2K5O4dX1NhoTL/DIaY+qTN2y41p/T518pooqcMYKWvuHoq\nZ1ORQd4H25WSE63MpTmtNuvXDBxUuUjJQ/tykI6AL3oCLVoiQJ/80+I8vuxK\n0jIMmpAyRpLCvai2zdQQ+c76QKXPcoxhZKhMCFlgeRWBBdz1PtDKQAqbupnV\n1LU034PufxItffhHiH+TGmP0DoTn8cf71GDZzoFiwkNLYCIsoUfbz8y3CAHH\nIR91\r\n=9KIT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICbv4Odyq5tNSMZOrAbLIcXzfJgIFavKLIcsZ/5tD09BAiBItnZQK8SveQh+qn0k5g9nmajpDuBJYyTs2bMvgekdMg=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.13_1584902921570_0.8209317247623413"},"_hasShrinkwrap":false},"0.21.14-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.21.14-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.14-alpha.5+303c339","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"303c3398e22ef79ee432eb1743cde56a8c8e23e0","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.14-alpha.5","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-qkp+9+nLHhbXha7Hux084r3uhFu/pWZoKsNWiElvQn0GtPcV72yPpbQXpL21ldxevMr4CGXuoW//GeX0Aa4o9g==","shasum":"b37d87ecea5698d3369d50f597bd42ea96e9f707","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.14-alpha.5.tgz","fileCount":8,"unpackedSize":18188,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefHeUCRA9TVsSAnZWagAALOkP/1fySbuqst11uXs8TBAW\nfzcIpOz7TZ08DuAnDvCtdEuARXLOHic14oAnyDPkOMJ44bi/CkXQFBuqn7OW\ntEXN7YcqqKwVd5NC/Jkl/IbBuoFfuIZHCPVjyX3h6e6ONZPwaEehXB0PLi7W\n3nrcK2nKu5uiY2f0dFhR3Yc5WY1OHbI2Es3ld6fKQSPFL5oQCzkDngCRxWrk\nen6qlh7zEGsQm87i9mFXXj3df+a4B2LJLRnIjnrF2NySEAljArplx2ZMYNv0\nAj9kLY/DSEeiqd0mEc6DAiPbTKmlBUxuPu+odzC3m5cXC3mbACsD93iaEHct\ngSwznFMu3JroK6YJGF3S6GxwDE4FYlsW4SqvkVZB18I/H6J8Uc0drUSPL77+\nfyJnf+S41dVv57rFLWJ6tF6xAkyUbxWbU8dTXx4IdhaWr7cg4HtWtzp/Tigz\nciceBXS2a49Go6MQv1p32o2DIT+6+MGaK7OamErdk30RgQw+SVTp1e63EQDN\nv4q1THTGyodpuX8Ot5gnp4JBCrFss34gvChVeSByJD1G79/v4PvT7u/gtYOe\n/poCal5ADeaoQrgs8YS2gsf+MqVOzpyVn6R1GSAXfslcWK2MUw6Bpwf0p6RN\nGXgSvpiXN51x5e83iniA3+alOzx1InLXxL8Mh7/gdgARRgtvZYgcZTZbapnJ\neQAF\r\n=nOq7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEbK7Ovla/gpfZiH/iFo+pUxrg28FO0xC9YvToMQoQdyAiEArJotK3x3x7SyOHGi1xb3wlCUgADVKVHdRFDZ9CseLzs="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.14-alpha.5_1585215379834_0.8825104836505466"},"_hasShrinkwrap":false},"0.21.14":{"name":"@react-ssr/nestjs-express","version":"0.21.14","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.14","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"e4399255389d9eaabcd96e3d8ee7d3690126bbe2","_id":"@react-ssr/nestjs-express@0.21.14","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-doavJWlJwAIGztLRXsOKx0WMJj+xJA/WYS26SyYtFnaVYebdXqPk43Tcx3qFd7nOkehc+nKnjZ8aH6Tqg0k/0w==","shasum":"6722377260e5f2fd23367068cb9bc865a9bf89bc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.14.tgz","fileCount":8,"unpackedSize":18156,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefHiICRA9TVsSAnZWagAAOM4QAJoi1AWxqf/YWyCcJ20h\n9VWwF0v4JBIM2B7eUAdvndhk1cqT2YD2uuz/wvwf6pFl246knBBNprmL0LGD\nrKVlu0xs9JRIyWj9Q9u1BBgilk+/FUo8RiyufMvYf/x9zew3DhiucxZNLhKO\nhjyuoEw4A2DMWBWlrHhM/MJq/1puv6BAvQCn1SP2/ApsckmRK0ZLY43NBKri\nZkh0ACj8yeQbVcigRaYErjPFxIWG5GgyiJC5eQ9zUbiLPxrSjVPs0EzDwqOK\nx4b1Rna2bRXf7MGE0+0JVFGgypSYlE3aJuKmASDLOoNhFDnYDt9wjMcVTQYY\nePQLE0KiuNOhnWFTa36D87dfH5JHOORXEjildigR3KAySlhgtdiZPbkXlhMe\njc6WrvCJ9d3mgsU5w/a/xQ37dQYFMqkMm/ZNfY2AoqsBq5QoQLEUe9NZ/7Er\n3DwRQAaWx8TLhpApm5LNBWaEW4VVP8mNjF5XTmDh2vs60O0FLjr0BRivfyCj\nOGW/asz5MapFfdlPurwcEEdR6Q6LciMq9+sReWc9hzAKGAZM60Li7YmLV8VC\nPMSzBWvz57aUis2fSz1mJPWsY6Kj0IQDfDez703qwGz/XqyYx68ERmKT9as0\n4ju0GtU3ubUOOWLUHQQ3svSh/Ha8f482j4oYDwosdTrDUze94rXojhy9u8Ft\nCDOl\r\n=QPPf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFIgUZxCxX+C/HoNQCAUlKpy5rDdHSZEDK49lc0oCN2wAiB14+2rUHEMtQHrYwZ8ov72MDDjRcadHqCB3ggH/woAPQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.14_1585215624475_0.5554637468027843"},"_hasShrinkwrap":false},"0.21.15-alpha.1":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.1+8cf3f31","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"8cf3f31f5fd58df0ecd40c91364e80aaf34fbba3","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.1","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-u7dhi7Owd4Gbx+LPqt7DXFft8JU0PF5o0EW5Iwt5fJJx2VDYoW8AfbWl2swMJ/CgKCIi08AolYY7E7Eey7clGg==","shasum":"7793eb1ad64595faa7cb5c1a5206e97d6ac29e80","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.1.tgz","fileCount":8,"unpackedSize":18101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefQmQCRA9TVsSAnZWagAAyR8P/0rNmNLR5EP78CBB5Yb4\nA7YYEir3jLFHGeHaemwvjBgoEmao71VRBX8H+b04RyKz1mjIVnHU35UEJ6Qk\nb0nyk3LWnDrvZ6UqFoR8BDllNVT+LLDQ+s+LM3ZeLHUa8Qoc7pHfdsc4gClt\nXec+oHwrVwvwkyFuh8e18hwQDJFU2PtI6uCk2VjS1h4VKJXIeo9yy76Q8U+4\n3nEDrllQTSm5hrTsnicFEj5M1ukPLJWKPrvuhCJ7oo8GMHt9E8Cq9uJooH86\n5rsy46CNINI8yvc6awbsTqQDk4U4RdusIIQ+NuDx++SvUZGrvgBtvUFaAQJI\ntmjEDYJxaSEA2rpnlwXOG8bU6OhdYLpa99Y7KoIOue6pu09LsEHF5H5Vdd6C\nlHlA9AaFVF5qgUOglCZ3rhr57yHBcJu83mZm7eMhJyXBV64rO2Csq6GK5iFM\nX6IX9QKVXsQ/q1vlC+GHaXwnHpjcwYY79IyxWSuno9PxkqoHZxl0FKFn6Wrc\nagDPR1Ar7BCAF4Vrs15fVPWyXzaN0DelGw0T4UoU1HyliPHoBbHs5O9K4tj1\n7EidvDo7enxj8Audk9wyymkKDzn+2SByXpvXrtsQBsSkbQqTRW/UIhi0NrJo\nqfAKr1UtwouvlLePliJUWw31ro0bxzc7lE1y21qUGdp75YF2T08/12Bc8ZYo\n04bH\r\n=7jqR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFqF6ET0RGJ3+Syt6RjBaLVEvcM7KY7n4bcoLB/okXLJAiAwdo08xvstlYtM9/9rrb02UsjKg9QGCH5TAXnthJq1pQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.1_1585252751442_0.47705416906511156"},"_hasShrinkwrap":false},"0.21.15-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.2+009b3cd","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"009b3cd9c8a9441617cd01d371c3cd539ef55858","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-Q+o1LxNTwXwGG7pRuxBq8gbpXeHi6OobTf4Xa+f7UNxpdo+Ufjrt8R/tLwvEBivmhg/xbEzXFwTCnmXhmomf8g==","shasum":"6fecb554cd030d8f802ca01238d0e36e824369e8","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.2.tgz","fileCount":8,"unpackedSize":18101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefQoOCRA9TVsSAnZWagAAH/EQAIS9ukCd4HHLr9NGD5Qt\n8C6jp/xxKFi4y+mOXrEcf6lBBhvUEWY1GY0SGk3VTG3bP5JVQeToR0crmBDq\nSvuK6gcisxLt9Kd5SAAH2TUK+KxuSBAbNJjvjC8NrU4bWyWy+nckvUYfF1iE\nlX2Mj+P4JabJVmNVU665YEWCEeh5rVl+RjkzvnB/N+ZTiiFhjlpexbvtvvJJ\nXz9jY+kIWpqxscxKXVCxjJ2dI4DzTaGoG6NNMMeXP3R4rnE81+7JAYlSFsYN\nELA88nvt/TOORaQoBfJ4dq0/zu2Asa6AK1a7L1aA7RlojdT9lHuW3OQxmGQi\nvMzzo9EEuw0ocPoaa74CGhx4CYKDIWRyFm9EwnQ6YgMzFD7bTjw9nuunmeGt\nz78W+2KJRlRsFY0FyhIiEUWySh8RLzVAmEz2Tyhp6eZjGpT0XVhaCPIvYWpN\nGUucDKzeXF7posSYYBcdKkN4G6rse3P22CWzFBQ/kBqdZuNDRMoEe874Ti7u\nIsFxuRHhJHG7XzQWE4FWweHwoXLreW2mdQZGJZHyxdMWpdphKH29FFNhy9Yb\nyyzvKL1oTMeNj57WieUsCSmGGUvV/bVVEvLpt41+FtLoBd9m6RKXKGeje6I7\nksU9ycnrV7Ah2cHTrjo+fF8zCrQuO7MM31lpYcyHaaDg236yKhLe9HEEN7br\n6yYl\r\n=jK7m\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGMCiZatf8NxbtB+YF0Jx4naBZMdqoQ/zxOuw68+mKR4AiAoI0fRTNkLZKuzoTVHorfYaFWNJhPsxxc8LG5zDPqKbQ=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.2_1585252878217_0.9401410428095183"},"_hasShrinkwrap":false},"0.21.15-alpha.3":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.3","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.3+7f5867f","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"7f5867f620c0bd280deb11c8d70c68ced1b4bc79","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.3","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-0caPBJjuQx4cm7wNIw1y+ZjR63pozu94VBNLQBKyo0a0qoe5sP1NPFtZWmk5ampatx0/XKO/2CJzoWeb+iaMyw==","shasum":"0018910e27fae23cf3405bf0a3bd8f649c2a6935","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.3.tgz","fileCount":8,"unpackedSize":18101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefQqRCRA9TVsSAnZWagAAL08P/1Y3SyQgON3uvgp9mSxq\nVSqlEf5uUN+HfipIYMmlHWpHeyGNdp9UMGEvfSSJjuiWY9rCaV7+G98ohZuE\nxKZOWWuRwy/1h2w5njCo0b3c4ed6s2g/r31kIUtzZmDLeorwYnEa+ZR/aVZN\n597CFRaqyQxNMzN50/mkQTEmCAk3z00+EaHcxEcUXj0JptS3wxzk+LlHcW2s\nvkcd+81SGt6gsE2FA/bjphJ6p6iyDen+tEuV7Dc02PouppasMbZrk0ailhka\nzSbhCEFX8TsGajlb2F8TGejaqlBT8WZFeIkV46ELzsw9I3KuEpS7ZGLX1Vxh\nZMR7nR2gFQIudhhHeIZcw7FKCeyhSzV8Ds77s3rNl29K6KQRbD83ucHfk+NE\nfUHZtEGIhjEgnQ54AbEqfRxmYPpBIXqavOdMTqOAYQpbGRvVAmZCLZSJfjBh\nchm+b60JIl1MuLreaXdinDcRKnyZVs3aGmur0pCwVUW2oiZpTrjNx0XKzfkK\nV18/pk35w326SYAIv1Y5yQgGUzhb/70GHk8CHC/03NIKb3HOc9PNBxQNFAi8\ntschXuA/Dz2uY7zrTdT+eph9pf2QJkE09/lwIqWT+bzOIEsCe+CWMAUsA90r\nNQiL7bi8nmyfCQZG7vFCJwpMdGwQjIND9MZsmdG7xdj2hMuX/b8gyN9q9aUX\nwxt9\r\n=y8z1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDq8yzyyS+n5wJY8KXYGSaPKTOgfsefKKALeeukPYeUhQIgPwnJwLcosyW9EybnmgyK0rZEOOHIfOw7dTNuuTjX3F0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.3_1585253009203_0.7477738350393495"},"_hasShrinkwrap":false},"0.21.15-alpha.4":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.4","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.4+ce0d814","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"ce0d814c62f2aa5415522ba3394673993f6c36b2","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.4","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-xUCk1pEe935xR70yOgskANbkEq8oBYR9206wO/jDK7tB226cCl571+jkLz4HaXOKdTdCTEAL76heflYkXCgkcg==","shasum":"c11dfcd04c53b4fb1b8902792c0a0c7e9e8b6c45","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.4.tgz","fileCount":8,"unpackedSize":18101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefQu9CRA9TVsSAnZWagAASz4QAIyk+Qm9j5NDRF1RId0T\n6PCWi9sJ0h//GdqSXAmYylcGA4SffPbuq8mKdtDRPkE5eXVzCTTiJ3voNRtG\nXRQBuJJ4yHjI+nkohcUQWSAzMvlbzPss9TznPHb267TS9e8VBH/Gnu5VBtVl\nbeo6p9n4xibHQv8oevqxrlEKyVitCBIy8RTYnxcfljkUImzUGBZ4iN2hhviM\n+TChM05wvydaEXgLDE/6AGWddpmYuLPwiVICoUIOJ5HOICLQXVUP9dxUelLb\n/Tb//qNAy6N26LVePaYKOu9GH7Sdde1iVNUFTI/BP0qNWaulRA9VFGjGtR5x\n1oe9e5+5cJpkCl3mznrgekC3Bv5R4tmM3iJ6RzyXzR+7iimG1eopOEKW5OEj\ndl5H8JXb6pk9irj1g9CMmXRDGA4Rp65fpfIXKvEoDKye+oOlpvFpaWw+8Cvq\nlbRWd0FwuXZ3K3r8mYekzI9dsXSdoGyBtxDbNSl3jEi3v4MwcM6ThqqtNcZR\n+zY6DOBAJWXhsBw/SK0CCtPpX8x9CORMbzTpFJeEF85LZs0O6AR5HdJiD2W/\nI6Wtu7Zvsiq2WaPv3tcKxzR/9pou8fvqiiBJru4aziKQYR7vYQ7dXLIUL8RL\n0vETcAo/WdsIKoqXJeOKo26leHVBTePCEKvr2MN4xsM3xmsQ8rrACRth1kXX\n49vj\r\n=tFkm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDVcrCbZ4SICISA39n3EOZNihen0maVOMkeEH8QZs75tQIhAK5CdFuoHd0HhUfVfizwJD5cG5zIXeeuETp8W6FuslW5"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.4_1585253308858_0.34565140164733665"},"_hasShrinkwrap":false},"0.21.15-alpha.5":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.5","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.5+a8f5070","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"a8f5070be6080ec79dfd0e46ed2722288049f4cc","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.5","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-Ej/AJJJ9/PshHc9I3zMmNvlPAgwsw7tfFWpUMMdCUPB1p1CopLEygGYtolvXfMA0V38EzXalvUyybDpwrhAlbA==","shasum":"c44008fd7205790f3a2d553170754642d4bb2564","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.5.tgz","fileCount":8,"unpackedSize":18101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefQ0rCRA9TVsSAnZWagAA/7AP/3QoEYtYp577X46SQue8\nOxSAsuIbrXrPCLV+aIg1BRV+MciTEhvKR4lu0QZjeA9chv+ZSTvBjO81jdME\ns8Mwoy3EQ34WZLXguiusOz5tK4ZJxAtrRCCMLLI25WCX3mSfTcZsx2b6d+zv\naseVVUg3uvkdNwWYCLtTmx1SHuS4pPet9EellBbi6KXzMK0toNbFQtWhakJF\n77lIM1q3Wd4diIFtR6wDOLPoKSKNNWFNaN+Z4+WZOlhWgfU5OKMKMULiB1LK\nzRqsH+h2NRfSRrg6PqdLeYfLjkAhFFwuose1AfN47Hx2TowpKE9HwC05v6Bc\n8FTizQwWSqcGdNOB6NU7g9VBGyo0vD5v8ENkUeNyY5pgo49lVf8OMocWZwAf\n4Q3+Mg4R4CbB1fSbsXMN2IiL4FKJVJHMuFJqwDze6lsGGVZ8FmKIYq7Afj6a\nhZh8fJb82Z4zhq+HpHEhMQxBzSGi4CEYklGyoV5tO+WDLdQqc9K0Sl5wSXV7\nueEXzSKLSNQ1itT7o50QO1iEKBF6xS8B8CeO4t3+adKye3UYhaS+evGtsimx\nDW6JIZeU4fz+JiHrg8x/YvoHrp3ecE6KlklLquFz619wAGU70QMr1vLUmuJB\nQog7NmQJHO9Bf/5t6XJ1zmpHc8O0Lc7JvRoPk6WG3mGXRHgLCxPPXhlSBPZc\ngRGU\r\n=CrbX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDDeOs47G5q83OhWVmcBae8sDVx90irzeth+fn2sjOzeQIhALqCMKD5vGifelxLG53is0dZv/zQ8a/ZU+S67/hcZvvT"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.5_1585253674890_0.3340025934028972"},"_hasShrinkwrap":false},"0.21.15-alpha.6":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.6","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.6+8d23210","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"8d2321043e4ef74a1ca9e36e0fb3cd5a7fab0ec5","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.6","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-xOunHVPvkXx+k0DyWCrH9fF6TtX9FmUJYKVmxzRp4KrivXmixq6cyopObe6qFchnf94pWipUHXfT3WD4UTbhdQ==","shasum":"217bb713630f27d19f8b9a7120184326efbe6126","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.6.tgz","fileCount":8,"unpackedSize":18101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefQ7bCRA9TVsSAnZWagAAo6gP/2Fl+IucAzb9KHHyygdD\ndBV0cDSIuoe+cX4K0oYaTTItyCx3I2z/nJwph6g8x6VeP7otrxKhVWcjyCOj\nsC5nF+Fl+NioasRrSCmWDvYpVz2v87WWppeiJB1UdAnlGk+PYnsQNHN2cwWf\nRXxLemKp54yZXyVXula5kcBHp6v64tT2S5b4+T+bVree7pTgjr8i7yh6hsQP\nXUH+ZdxZkCYUQkdcMK5+OHtiDY3UIf5QYOdo0J+3wyfMbSCalcNkLcaZvBt3\n29EDCBr2EEmhCuDsmUZzjuU3nVT4/ecWQbzi7kBirSoQcbXjMiR/ckba9wOi\nxY7RHjFTLcyJo7MMUZhJVEMR8fq/gGTKpKhL55E/+I5nmO0Xzcxz26YNK/zk\n0/aR3zQmdgFsSHnXgvGzaVlFxUB9ZgEiH20FGmEZzbpUEmfb0LtYphS0ZQ/D\napSQQc1EItsXIiRzr5/+f/l53WkgcfG+O5q5zk+hf55J7IwM1l2CSHWScA56\nbARmlBS5ZCkbOiYyEFGijALnbvXiZzZNT9BaV5geU7v5thYxiIog4ZkJhPzi\ng4mHyrJIwH+SekqWpRLJJVoYEsQ4IOVpA+MCFS8I+DfzRMkSNBQvSGJJLnQJ\nJRer9uwNMjCpJ1bSrT2KetwsP+Ea4Ojathf7ItInrtjwnXsFq0uOc97zHyQR\ntkPE\r\n=+qXa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC6fo+oZ7LcQ9Ch/vhe5F5EmmxsPZ+g+BXXh/y3SvjR5wIhAKgXLIAfSgy9flgqRwq8KwQ69PulTbk/GgT8IoPeFjwa"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.6_1585254107542_0.3357713316187585"},"_hasShrinkwrap":false},"0.21.15-alpha.7":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.7","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.7+fb96893","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"fb9689333efcd6fad5e1b0031ea93116b821601a","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.7","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-fDNGwV9FLAsz/RshaNIvgV/q9MUrEOlud1/ncGq+zF86dPFdyqhgdI7YS/Rht6g13TztjAxJlbTuo1itX1gPog==","shasum":"87c29b919d4fea5c5dd4c47d9296e0c0f1e5167b","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.7.tgz","fileCount":8,"unpackedSize":18101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefRC9CRA9TVsSAnZWagAAznkP/irrNf39/kE7js6UH9/5\nS0BecoilocuHxzCaKlbxYt3JZXDNzjI8fxXG7Hhnt5G0bDTMQQ4/H3ki7Yab\nTf5/RX5dDJRbZI8K9Tm+sXZdKwgWVOu7/o0Xn/Uo/CAMY/qLxuLPr0CRq83R\nOgB737KtMf9xvYMR1VSgHBIEYyJ7Tes8Gej6+GlPu9p4gEIrncmKmNVJ4Xfi\njzTrjsZcSz1fU3POajMeQSrjmgs1oz0saiUzV8/Bz4sdkU7364r6r8pA3sfR\ndv298h1sShA1pX7q04o5jOfBeZcAse7eXnmRVcSy62WetPxNDDj3mHlDx4lw\noP2eikfi6z9WLBFkRq7VeUvt2YSxViLb7hiB1i6zkH6t0CfzvZX8KlDVm4lY\nYWOib2NDji5b75F242OaZiTezI038ki1/eBpb37+v4xEv+TMx4jBx5QWHkC5\ndDPRrZ0b8qR8kgzaqT4QbOnoVTFq8xQdj6vq+5Ka/ClhCCPyo/UZ3RPoZ/KS\nxwl0Db30ORGlCb9Aqsh0A2tkjDVD8nnceO/iUjit/lDRBb3GnRWGZZyALIZD\nlpqe1k6A6s9/30qvy/xvwkyH531lz8VealIs3iRwO5l3pkP1exuphNxzZeTG\n7q4SMgiqYZduGA25bNoTO77hVofxir9zo+wOmueThU4Nphxuc4uHkR+Ow9tS\n/EDt\r\n=0siD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDlj4nOjRfYTq9EcwZM0h3e1hRX3Wc4eY7iGttQefM4RAIhALPc0HGUfMPEgHTXKCnanH5lXOaFj5RPwS9VXGQRu++w"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.7_1585254588608_0.32997312826473935"},"_hasShrinkwrap":false},"0.21.15-alpha.8":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.8","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.8+9d180c7","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"9d180c7dfbe6d5e12a7aaaa870af34eec732bc6f","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.8","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-WcvYjqnvg8eEndi38IFO10iyMIgtiFrOtV0XNdrjvLdxRL0dcKQKpA2vGVRZXLPvaMRnec0nOg4w5lKzmPQBFQ==","shasum":"eb06d66a92be6600f60c72f06a6458c23ed90fc4","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.8.tgz","fileCount":8,"unpackedSize":18101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefRGmCRA9TVsSAnZWagAAC6cQAIZd9x/kk6FWPff6e4lC\n9u8Pg3WP3TLHMcctUonJWPAKgTBxUTm9vKDvXPonUmahkDaHosj6KOs5gY/C\nuwoBsXLfrDAH7/hfaOYHOnecxtGyk9soHrs1wGe2FIeZ22+qxMcL0fdVB6Bh\nEZ7HC+WohmLy7zNLpbpvWkyNVl3eHdhHlyOuH3kFTpqdlnS98asUKrZ8VIla\n6HfKA14FYVEKaAINKJlUfB+xTafkrpWD//s2T0Ptx4U6Apsv+qQUtG5e9oOJ\nxNG4htT4rxUn0FHaRUgxVRSCsENmBCZQi4YETWBIeLpXpafmt/W3qKTJRsqw\nb23u0dx/XKYq27WTxZdITE865gwJ1kA8us3F2uevcodBHULG7IZNTqUC0QQb\nnkVGDK9WHYWB18d7XJMVpXtzeluge1bO8FDrWf5onARVf8sWKiIUNFUMH/EZ\nNCEIw/j0nbELHWkzXpTMlxEeLXPBNH7OSogHAxrVzvDjfnesxkRCQ2vnCubx\nYtvOoiId/zgqLf7NYkhSyH6qM0+HDgbZOBYItGPvPWBnwj7NrA2TzJYucnXR\nfQ9xqG9qdxgMQbt2gTRcyrGkF8da6zWeBex7lc1PHoHOsWLvUk359pinc3VX\nFtXeX1cETd2mU0qMpF3khdIgHoxIzIce/hI6R2AEfzG3qoKlibP2eP3lQr28\nkTjw\r\n=uUxT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCSLxK9M+kfe5RYl8JB5f3NWSH5jsaZVNtC3yPWo6Xk4gIhANEIDI5KY/z0rLXDl2S4Mxaai5o8yOjeyIEWZf5S0RU/"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.8_1585254822262_0.7705720864832433"},"_hasShrinkwrap":false},"0.21.15-alpha.9":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.9","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.9+3763a1d","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"3763a1d0120ceb12dffa4cc57318b22305127a4c","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.9","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-VX623vH8kghLr3bFJpC3QK2jhif2+39acboxR7k3fjKCULD9aL7J1tAZVBUAbWleFCzI7a2Czc0UOcYW2qYDNg==","shasum":"71373f90e08c7dc7273eeea9192a68d2d8289e49","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.9.tgz","fileCount":8,"unpackedSize":18101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefRNiCRA9TVsSAnZWagAAh20QAJTx8qwPV1oH0qFpd21q\nRI2GL3mHwpd/kyyKffwcyGad0LedhLDAKovTR/IbBXUQYi9h9dRv7W7p5eM6\n3v09EGyb9uJu+hRqQn4GYyE7ojtwiwklFFRZPr+2ZNaPDu89jJ0b0MdjRZOD\nJYsA5v4zdaxyWl/BYLf/MgQQlovtPiI/T1Pif+pJ5yZT6TrcYad0ED5JpRfE\nX/5JVoJU08rL5c3tOyrZGdB8y/MnUb+st2vk5CeLeIFdJKubmXkY7DZ583q+\nJwA2RyBYgn8CybiOMBApvkq+HDQ+MjXrlkTmuyX1N7hquYXOoXXAHVMM+hzK\n0IknPRSXxGyAPgOpWbrd3GnIi50o7uw2T2a7+3UqPjZzsyDabj4WU80jwAsP\ncLnBsPMAWlIA0lN7+DFJUdgP+HSoxn1raWBNb5vRc69tOGzlmTBjaOcScfWq\nSCGe15Oy4PNbJvDFkW6xhYwBiDnFttXDxSQmNZUdDCM4GStA8feRXxmUi5nZ\nFh/AzJ7UhgJFfT/p5D/sSklgwGnqPmUXsJ3OpR7KU5v3H1XMQRjrj67Uz0Zx\nBzhwOc6ayToVMfKRLbh7D6jH+XMMOrEEf2/CD1TS1ei/bBNq4gbzs+a3Qxo6\ntldSMAyRbm7AGI53sTee1ssfjdpAdNRJa+myT19+rkUDzLZ03U4ts/TRuCoP\nRVhw\r\n=ACie\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDGcStQrJTipnCX8hg2dFBcZEPTVSirBUBLruo5Y/CSKQIgIH8N2ww/V+CfRId0z7UiBi7JhML5724664Jw535NfRQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.9_1585255266222_0.8008687851887224"},"_hasShrinkwrap":false},"0.21.15-alpha.10":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.10","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.10+deff777","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"deff7773d3e513732c5072ef06152cd4d693bbe2","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.10","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-9G1V5a3JeY7xTB23xdunGD1nE2Ks2tbpJvB3/wFNb2y2RX4d58wdqUN8Fy+WgmHboPcel+wHBcIZuAleil6J5g==","shasum":"9677be13195e693339d059693d3f238f0264f854","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.10.tgz","fileCount":8,"unpackedSize":18103,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefROgCRA9TVsSAnZWagAAAvsP/1lABtoW4IW7UYN+Epuk\nH4yn5TxmoSQUS7dxezJlTeNrOnYQzA+OPpM/mqN42sAAaTawqveROjMFdJa0\nz6xsP3vuktiXTYX0lpqtzDe1yUKSsPSvC+Mv6ixAwTjZu2KSN/haomlBdVLw\nXJSSuN0g8juIhs39RmTBvzAhmFcfkajMEtLNAkyIWJXK3vHVtpatHoQb2TVf\nkxR6YfKhiqqjNJAlG4Lc370fxm2R9hKBusldw4UVbX2wz6cH7KQrPgbkLZ3y\ngcx6idw+kxQOqKSQDdl6VVmEniA5gaEUcRsHoLcyIf7g31jQXU1P7j2kdoZo\nMk27CmeTOdZcINruPVQY4Tg4ijT7DX7njdcc3YCxj2g6dC3sRtle4iPgCeAi\n28DeEfB0RvIT/XpFh+p4GSmWE0s/SAw45V/JmIdHmzi/56C44OYtzgM04oGp\nKgn9eo1YXa9kmzCG4qDBNwh/jxj0YwjhoomMHgZF4saFfRoHFICh5Ks6iMPt\nPXCOQoc8SpM7E9GCiABfQgE2y0TbVd06GhU8cPIPyfLhztUF5fDdodz+PQv3\n57VyVxyKMUZlFf6/Oni8LzZTOJJXrlol0zuT3l6zANw/sMCuaEIVC6QIAEqB\nLXt8hyhMoL+2iis33LEQ5lEHsDOvTl3vZ3vq0ZG0GdTLIVMQcfYNyiCuX7q8\nSAw4\r\n=KA7c\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCnlfekZ9MnlbdlwLgx7eI869O8kRBHypdVAoTow4EiAwIhAKuWu1xKA60BkoooqPH5oiz6THZfrgX9numh83WIr84v"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.10_1585255328493_0.9170691840443783"},"_hasShrinkwrap":false},"0.21.15-alpha.11":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.11","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.11+8e03a50","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"8e03a50213d05b8f43e40c09d8e3a6a00111f3ce","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.11","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-c4A+9Oxf9HWNBQWKBxQSKdjnf0cwX5xAXaqL6BafzdhrvLOooBYuYx72MD/BcTTacA0gQHLDninfQ9TCRrskgg==","shasum":"136fa4f4ba985bbe341fa6aeba67193519460120","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.11.tgz","fileCount":8,"unpackedSize":18103,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefRkdCRA9TVsSAnZWagAApKsP/2s4vLNW8YYURfDm0tSE\nj4C7VySqiqsvOhjLmC7kg3cs/OCEMIVTqqvzGPxXaSUDRonjp6WpPqbDqU+D\n4BfrLq43oz3xXBA/mqn9Ktf7GAqyz/5zKuN+SrFBKfI1sulXqKhILIONR4cU\nfxM5GmX12m6ImDHoGkw0W5USjMWVUZSDQ4gGHvHfRaYaMPiLBlIRqDnC0Meg\nro9n+twdQfpA1xZw16XMIi+VKbYfahS7j/bBW410fW30srU9NM9SaB+4KRtd\n4gLlnJ7xEzHxq/a+PSdTP5RYyoQFuGeU0AkPc0a/p4DoqlgMFRQpCnc6vvmb\naJR6iE3QpbC6amC3C414Vnkw797HtAGhhDR7sygSoQ+YO1OvmQxPrz8mXYYM\nPhNcJTYObi607fLiZp8ZXMkj1Ee7XTPdORimmcmNQbC7/v2Bat8Z9svdTKBU\nJkkQLzs3M325zdwBPkZ0KIoGRRAi35C7268/umOR1xN1PLxQ2tVL7r8xs2Q0\n2pw8vrOKSQeE7l7BbSHPeXhp1Nf/MF5XTdp8VLrfYCj8MpBTaNhlG8Mwg5Ye\nE6Y0Mr5CCzsMHdny2bHhXpSatRJ920h36GFQsEs1cvRBrb9EJVDgxp3egfKp\nNprGSEGn8En7t2WwwZsRm86w9rtyw71mydIaSuxcfJ9T+BX56tscUZIANyoJ\nvGLT\r\n=hQxq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD+miCPSUhnnTMLwQj6HAd96xjuiUCNZApeKuH1eU1gTgIgC57q8+cegI9C1fjAnrbRBQBV7ZiMNJ6C7lCUDjoTfpQ="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.11_1585256732736_0.5486387334637344"},"_hasShrinkwrap":false},"0.21.15-alpha.12":{"name":"@react-ssr/nestjs-express","version":"0.21.15-alpha.12","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15-alpha.12+6f8b36b","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"6f8b36bcd598f3235a2af421ea09a7252e668d12","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\n- Because it is just a view template engine:\n  - It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n  - It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n  - We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom `process.env.NODE_ENV`\n\nIf you set `process.env.REACT_SSR_ENV`, you can separate `process.env.NODE_ENV` from react-ssr:\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=k8s REACT_SSR_ENV=production node dist/main.js\"\n  }\n}\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Starters\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.15-alpha.12","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-hhEyP6UFD6lCktTupKv2nQR1UoX2ds208Oa2megwqbu9Sw3Kz22GKmD3kLqv1nDBM03kLhis7F35kqURgAQbzA==","shasum":"926f6be267d4a633b9efd5fb758ab53197112b7f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15-alpha.12.tgz","fileCount":8,"unpackedSize":18369,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefRsuCRA9TVsSAnZWagAAXwEP/27ih5bSkep1PYTYszGN\nDkERqkllucDY1xFLoJzATtESaF7g/mooZM1DFQYCLU1JksuogZ6F3+4VynXY\nDz9CNWyUa5LddV74Ls5IKBGDlXD6x9U573gwrLAoQJvpBbuedMKh51poMimM\nwk7Dd2wKjnBH5Czs+Y69yg1sMlT5u0jExqMEfvrmczajDkxmNHKzh7umfICl\nb6FDH1Vo5G+yHNO90ml2ZQ9lwmOxGjbnAzd7Lh8RHdYWSsogIY1F7XeFvJEO\ndN3jBE53emVbMNdbQxANA3RRZdvkou5bb+OYAwQUevfeizwMJh26RibOgqBq\nw6sFHfzjt/3M1sOHuFdp29thecnvbXJr1gCnihfMsgdRXtrgacdKGLVNKASU\neBcwOq/nXMqFLzki1gCqIJPE3LOATAlBGw1Jwlk0qBW+FgG4QWssqnkIE+d+\n3i3nyX1bLuEBYtLnvPycpZflo6ahNxh6+19+bv5fioVNcMowCHnMFPiZoDzM\n2Fet5AddpKUWTP//KOTeqJAf90UwCPgJVkdOYhBKsp/2e26khlpHdKT21oiP\nYdg0GYa122+4YweLLRUsgv3YeSfvCFaer168Pp9IEnwVNOkH21FxYM5jUYoh\nZZ9zovDWJkGb0kqNrvx+OBifo71H8pz6u5e02ZCpBcnQeP+KpgWnpd+kOfpX\nGwM5\r\n=uHfW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID+3JxO02oItfOmurbRzDSss70tYjDuLChihfSKvJTvYAiBKIwT2WPqxwqHthOhJHkXI/84ffwZmApY0M+3BtLF7Ew=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15-alpha.12_1585257262517_0.32286442062112775"},"_hasShrinkwrap":false},"0.21.15":{"name":"@react-ssr/nestjs-express","version":"0.21.15","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.15","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"6ddb0f387f3e1bf25c2874e21789935ccd5cbeef","_id":"@react-ssr/nestjs-express@0.21.15","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-A0ZbqOa6hGxo8mAqpKVTzU9uKL6yvRPtVcCgeIBLH0Q3IILfiAIyL9GIRuS3Kiar083/0fiFkIwAFlBV028fIQ==","shasum":"d4dc5e713c0fb981ccf3d8e6b49d324b859f7fce","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.15.tgz","fileCount":8,"unpackedSize":18335,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefRwyCRA9TVsSAnZWagAAEB8P/jfXv6llYKee5HiQXFF8\n7YxfI/XH+O4PI8YYiig0j0zR+mQfdirv4msReWApagbKtBn9i9bqQdsz/SJk\nJ4eDoaRA+Kw//Fi5sVit5hvdqfTBjVYdXNMa8eKemr/xoYanxFVeCXGSyyvl\n+Dh57MLIt+sxP5UotukhkXZiluJ0Ow+mux67r5sovmy97iD/hrnG6iRJNFyI\nC7jiYH0QAo1b4BwOUpuxSgtODoBe2SRCrHZvjsl6Iajd8r24NtQBnX7eRA+f\nv2E+28M5gb6N8AcliIqxyFRwl3ye7O2G0GOW/NpiklAZMTQ9wMxstM/iEpQm\nMKmzzn691mztFl9FK1Zy/Z6ifCR7BBdgnxNopc5Pvck6JYJfBHyHcnXrDzpZ\ncyUKVWq9pfskK+lvnPrD80ahr3MY28J+NlpKXXZgzKoHFYxBp31Fbik1E736\nzeMFTaQDjzmV0PRr03FCs4jJuW3ODwhJQHDFOlqrOzC4Rf4jmmHwD3Wt80+R\nYqZv2WRk+wYBw7zj3xUx7JcakOY4zlAdXDueZbsRk/JMatRTkpbhI2VaPk9D\nhP15mvVewUUMkmcLoeKfnGGMTdkDYL7c0vaX6mvA0SN6vTJxAH7hosgvcPA8\nUpWTDs8uDtzmW0gIPvDCrHYjGVAVWYmT34aniujzVmhS8Wt5B9p9JxFGuWe0\nDlzw\r\n=5XW9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDRGiE1oVsQeL1Wa4BRC5/q3HvhTrg141Et+OS5yCRrJAiEAsKsfJ9eMaZzm5fxWLdQGnk0PHeLRGkGyWLjitJ32neM="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.15_1585257521647_0.0941478024324951"},"_hasShrinkwrap":false},"0.21.16":{"name":"@react-ssr/nestjs-express","version":"0.21.16","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.16","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"b974f353c6169bb387938354c2c1b673cf89dc28","_id":"@react-ssr/nestjs-express@0.21.16","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-sxWsrgWD1+2iEpUftUen7W5yhBV8AnIr8Nss8oezL6uaJ3hpuKg5t+DJ7Uzf4E3me5IjBGmxMZ6ZTz/k1QpXsA==","shasum":"bc783eee4e2531a1ffb2fbe66f5657f8d887c803","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.16.tgz","fileCount":8,"unpackedSize":18554,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefXyKCRA9TVsSAnZWagAAclUQAJsC68UR5AfFK8DR5nYQ\nF33u/vSeC2bbIR7fLxR7JQa2VZz3ZCd60TCgPBTMVUV7ByBKNqMD+WKotk5B\nSs5Khgloycnf2dQL4RQZwGJ6jVTSAJCFSSm7pINlXmb6IHF+XoIa8L5akqzB\nIgPxPSfE5JXJaU5gAf/j8h3ued90jm45fURYiM9ug7e9RAg6+iQeWE7D1M/a\nyZWH40jW8N/8EpT8bGnrVYzgD/+k/Z9foLfhRXWS2fBkZwCurSfJD0vLGJcC\nNjZj4gygWgo4yNTizFckT8apUzAkQeI0Saq/jJxrRp7EuXmcJSCqo+I5bxd7\n1Vp+xySM6I282kMmi/F0whHDLu/uzH0qHLSPmyvphQWLckBsofi+W58eQXb/\nprnjiUtuZpcbVCslkIMNV+0XkBsHIMGB243hmUFVGbwMd2qEsC7Mh71Q7+QY\n6us/ZReoKxcOKVrjWF3nxw9HfrNzs6iizo6BRE0aF3J6YM1Val9AIP+lFmKQ\nVkR+60CPRJuV/JyA1HdrkoIdqail6b8sPq7bXI8e53jgUo7dHMqobfT8ex9W\nkDHF442VTl7jN2YeuhviYkzQpC9uKqhSEXmJpAGQ9/MNSqQrQ9N7rciqzaib\nNS7pzcY+BsX0MDMyggw+8hOF+pjkd4qCdJ4uWq6CRZothmLkbvsiwLxHIwIu\nnO8G\r\n=ox6w\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDL0juMwnKSsIOgoJUe4e+aQHItR8B+PGUS2s0ntZjb+AIhAOYzitI7RkX+eutp8tcSYCaqNIIG6YlGxz6myd3WTRZv"}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.16_1585282185810_0.9443244378054498"},"_hasShrinkwrap":false},"0.21.17-alpha.2":{"name":"@react-ssr/nestjs-express","version":"0.21.17-alpha.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.17-alpha.2+2474884","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"2474884164d5434bd1bf5f85418282fad9b647c0","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\nBecause it is just a view template engine:\n\n- It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n- It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n- We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom `process.env.NODE_ENV`\n\nIf you set `process.env.REACT_SSR_ENV`, you can separate `process.env.NODE_ENV` from react-ssr:\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=k8s REACT_SSR_ENV=production node dist/main.js\"\n  }\n}\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n- **@react-ssr/express**\n  - `.jsx`\n    - [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n    - [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n    - [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n    - [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n    - [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n    - [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n    - [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n    - [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n    - [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n    - [examples/basic-multiple-view-engines](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-multiple-view-engines)\n    - [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n    - [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n    - [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n    - [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n    - [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n    - [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n  - `.tsx`\n    - [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n    - [examples/with-tsx-redux-todo](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-tsx-redux-todo)\n- **@react-ssr/nestjs-express**\n  - [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n  - [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n- **@react-ssr/static**\n  - `.jsx`\n    - [examples/basic-jsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx-static)\n    - [examples/with-jsx-static-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-static-bulma)\n  - `.tsx`\n    - [examples/basic-tsx-static](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx-static)\n\n## Real World Examples\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n- [react-ssr-redux-todo-app](https://github.com/saltyshiomix/react-ssr-redux-todo-app)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.21.17-alpha.2","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-M5asvyoBPHRGpmdpon6DvW5jJM9czxSa1P05lGPFym+wuS+rpt6g9oAlGghVm215+PY9/p7niFuWd5B5HKKUpA==","shasum":"6c399b19ecae803fadcc570c5a3edaa609fb1649","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.17-alpha.2.tgz","fileCount":8,"unpackedSize":18716,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJefflmCRA9TVsSAnZWagAA6BAP/1eyYZbV863Aq/HKv3rn\n7YIJRbfBcJDQmyOAs/qEVYjeqmcCLAspBKy49WOcV/KsHiKbQcGkGY16K3qG\nlQ65DRAJKA5S9p7PYZj3hIqaX6XptXuDJ7C8LJpyMgrmsB8YQh7li3Yu3ANp\n6IigJ8YdTdl8JWha1N7+yO+Ty2nsIZ3ku9+jQ3oeMlxPbfSm4LNHEFKMgZdH\nf17iDx3UurSDbZZUxL1OmUe0H1gEer9/TbFLE7DRCvLZ7PWriYsGQ4N5YApC\nEq03V2DURmZxXLaEQrtiAwzjKsIR0eDMGI1Y1gjw9XRGrr0cO4bUGMR7lVFB\nkFP5I8BNRcrUrK+dmH6ptbCiH15+6Iw+BX5GrG2ZDmq3VxOiJbH892m+A/rs\nx+pCmmDh3nTXYdD3LkpuZn9Z+Qye945+DJxLBhUSfdULy0NlC061914+r9U/\n9191MmOSfEbXiXRmXk5kBA2Az/UsO5XBHmjGuHsh9D4kVliqNYw+dt/nGiD9\nWv3I7xKJAUU37Wri5Yg8SWiJ23iFvlz3oHAEyC3qrYEIoKte8vYQgBYCE4cH\nSCPok8tiR/h/dhEtQ3x63t1yTfybJOMpHoUlME8v7rkIwGQcNB79WUhqUfSm\nff31k5P7o6n9o5gg//mUvYWIqBq8BXOj/phkNJ/u9y1nXuVawtXMLQhN2gu9\nHk5p\r\n=0fem\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDs+gZL7Gq3xEVX5F5QwSr2/JUPXfMYGq1dzjDTkj9+DAiA4NFtbyc2HIrMTNaiAOZTCXZQS0vrJzp8dpaR19A12pw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.17-alpha.2_1585314150301_0.24601166949579323"},"_hasShrinkwrap":false},"0.21.17":{"name":"@react-ssr/nestjs-express","version":"0.21.17","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","devDependencies":{"@nestjs/common":"^6.10.11","@nestjs/core":"^6.10.11","@nestjs/platform-express":"^6.10.11","@react-ssr/core":"^0.21.17","react":"^16.12.0","react-dom":"^16.12.0","reflect-metadata":"^0.1.13","rxjs":"^6.5.3"},"peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"aef50e23ab7b49d9419cc5e12780192d6df14e81","_id":"@react-ssr/nestjs-express@0.21.17","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-/4r7tS1V4Ex5qxcqNriEp+4dy7e1rDM9KQYpHGtw3ci5+fdjR+nwOoJlw16NTB53/GFyxxgxXwsAVOXLKrnLRg==","shasum":"263bfd204fade1aa815e2866f7241b7200119270","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.17.tgz","fileCount":8,"unpackedSize":18684,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeffovCRA9TVsSAnZWagAAQwsP/R/SuTIqY7iMvyUrMrNE\nFSYb0VPmfV4Hzi8oCdvBaz/LZkK4+MTGgEa9fWs03+dWeIVNR92Y8vOnGwVA\nwP3VvuEMPmWvNxblOi+2LusghrjUg+SI6TbL+Up0Ma1I/vqPBmcW0dwpOOlO\nEZELczFvTqzv3TYqICKyP7tpfY0tlWjLkiWZ6fiApIb7MMXZIWnr6OpZZHGe\nmHgxO1vpmP7c/3DMJoQ0I8a3pDTfTqhF9iMrSH3yuih3dayxXW21K9JFqBCm\nTE9iOio70PqgjwASuCAQollmymvNhqsmGOpHPrSiaBY22JtEnZFH294wjn+n\nl4T+cagYE0CkQqee1faTDesqlarIS7MYOpp4z9kjkxD6GgaXz8fixrpLmuRA\nZ8We1QHkqcaMEIW3axzJfb7zaNiNVuRUjnehXj5jjWVCAoY1dqPLSRg1H56o\nEALgecwYwwTTeQ9NqaLpd7KHvhp0QbAcsg/vVn7zsqQamzq7VY2P7PKIMnkj\n4hAiopJ9e8rx99DYbRNfvQ5TEgDekCQ3FXUWmPadmjvyOp8iLmMvNrxR4ahj\n6UwBpWcppYIdmI9Zcm/yNbSlUcvCW4eVwU70s6Oz7rm/PpV5Ln3QivcxQopR\nMGhGIokG3sud23/mK+Pqj30zpU6Gz3tzRhayYDR1KEPTzaOGauNjVes7KUl2\nvJJv\r\n=m0Dx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIECIB8oP1WbjlRq9zsp8PNkQi0auWmm6ZVeNRDr67uhmAiA06unTv1QhG7ntY5xSxw0mKbRLiyIH/sjHnkVYZCh7Nw=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.17_1585314351326_0.4232353914960212"},"_hasShrinkwrap":false},"0.21.18":{"name":"@react-ssr/nestjs-express","version":"0.21.18","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"0dd2d24de76527ceba13edbfe1b56719d32408ea","_id":"@react-ssr/nestjs-express@0.21.18","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-Q6H5rQMimYbYXJJHXVKl5IEHCNY5CMDoZm5aOd+8C56BHX4w+tUTtS/IVJ7++MvymCMQ5xk05rj7/7SmdxWMDg==","shasum":"cc8b4a99378def76350408ffe23f9d078966a599","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.21.18.tgz","fileCount":8,"unpackedSize":18057,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJef75nCRA9TVsSAnZWagAA8IUP/2t++gWFCocAKZcCeQCz\nIifwwXW3PrWJyorcrcIX4+pe9aDMIyrZf1JZO+1dwRB3zZlT6jhAXdQeF8n4\n2lZKOOx83rrAVmimiZrjgVl8d7aTqb48liV/PMRohtgcFWJGdHM3OAtXl7vg\n4SHUvs1YFavndhA+TSmiKTDAad1kRVB6G9PBRh6i5w3jV+bKe0KXehM0pzyU\n6ng+xyDql4BNe4ofyBOV2Q9B2O4mTJPseEPxdG5phHsgfry9sjQBRIO9gz18\na7jR77y8Fhb3tun7O0VfahWsGr4DhAsO+fx7vlOsa7WhUzlqdEMgoVZCE7u8\nDQjKIxSVBB5K9/Oi32dCaC4rQGTr4RNQqnOhInnCtoY3dYXZVRnFDEiMOkVn\nK2numlRMJS7Nbgh6DuI25n9oWRsUF2hELsdbGPV57aJf7BACTBk3uLgo+9Fz\nhU7gpYmCa6Wd8seuaPH34rjEgUPztZEG/UEN0CuTg1wCdsJv1VDKKCAZUryy\nX601DFTYzVjVdN8TtPRBqGkesVqfx85C5ti4SMCE8io5tmKBKazRFEcLfJxe\n/7hPpH0ZgBHRY8R+ZLJeD0FXw0j3CutBkSqW7Qv2CE3zQels0WgZy7auLK03\ns5uoMYueSRY/iQM7De8URBz+munSyp2jqqqWQHwuAr8DjQXT8IUB9aB2LnhY\nZxKJ\r\n=5//Q\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBA1bBkElRATCKUwXemUp9bXlrtbe2V1m1ZUGGLwCj7NAiEAqe95rQrZGi9ZkdOGJw+hBSPu/yPr7z4iglddXelomBU="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.21.18_1585430119343_0.2932325052201441"},"_hasShrinkwrap":false},"0.22.0":{"name":"@react-ssr/nestjs-express","version":"0.22.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"00bbd456f0572dcc5294c7afcaf5bc68e3b08d3b","_id":"@react-ssr/nestjs-express@0.22.0","_nodeVersion":"12.16.1","_npmVersion":"lerna/3.20.2/node@v12.16.1+x64 (darwin)","dist":{"integrity":"sha512-VRATKSEw5BhYC2Z7Bb4WoP+SFARwWlCTqPcwS7VyBv+9YjTMV8o5hM3VnbxD0hdZmfGV0Beg0YudFXap1oKzRA==","shasum":"e5a89822e53870c353e13bfa47b726b3fc5f0921","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.22.0.tgz","fileCount":8,"unpackedSize":18056,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJegIVCCRA9TVsSAnZWagAALnAQAI6mgYpJ7mRcEna8RqgF\nQljp4ojugjL6cUUfBfrwX6gSYKY6hL17oFhYcrUFa4Fn3RDbYN797MUFBOXR\nu1gUksHipxc7UatlkCkBNcRo18dRqqZmqo7Uiafa4ic+dz6Sh0o4VjcKWC0p\nR+T7QkwRBamJEUkynYA/v4AZYpJKuaIXu/5cJ7PsMR/G3+k4oaObVJOG6fep\nX3AiK+OBkSsVz/8lIh2igS2873O0DW5Or2lC7XSgZaB6r75smVL5r/EuoyvK\n3b+/ldOFbIBqvvn1WnRRZJJ5UYLdAZbAgL4kfS/S0iVMR0RVwjNfJ3FdQjDf\ng671woj9FSDkiISv94ShpqLJEl6xGFDyPEi/mv4vraztH4RxSMpEKT4wahDl\n2SeC4j1cxTSj9iodUUygnfkXQBTCvPvwAotRE0Aj8RrpCAeke4jgme1bLSAH\nrNO65Pk104huddPvlieKi5cx9m0TTEN/O1y12LVhggxY8k5dt1S1Rh1ihGi1\nRSW8ij1DARHzHvCwD8vLfFs02ln2Lw40rwwINGrUDW2Is5qEwEQT/rstn4sg\nOvTVTg4zWSpjF7+MdC3GIVS0uwXju5EFLsJvBKREfXzkGAloE7B+v+DYQCr/\nYePWi9dDGV6ZOLcMdpyOWL9N3Nf5UaNYKvQhiTY6UzuXCzwmjVa6KJrP253k\nbLJj\r\n=Zxl8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH4JBvEit133PAELk3pVTAvPKCsa47E/JK9ZDcevtC0FAiEAk/AuzMZpVLiTAsR3XdSJ/CwwxFhIisd/3AAZH//FXg0="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.22.0_1585481025587_0.9413183664044458"},"_hasShrinkwrap":false},"0.23.0":{"name":"@react-ssr/nestjs-express","version":"0.23.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"52e2ac772bc00dfae297d0a115303bbf4056b9da","_id":"@react-ssr/nestjs-express@0.23.0","_nodeVersion":"14.4.0","_npmVersion":"lerna/3.22.1/node@v14.4.0+x64 (darwin)","dist":{"integrity":"sha512-hDfYFYSZ8t9ztXJ9FxxTlqFl2uTTuEe+LTv1o1CJyN7+5a7M/JeYLHKoDAk3PohYkA0jw+HZpjrnwu5ANJbuIQ==","shasum":"ab295ae5e7eb8ee46bc02365b1a616b4d2f931b1","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.23.0.tgz","fileCount":8,"unpackedSize":18056,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe4IIrCRA9TVsSAnZWagAAmxUP/i+wAoWycoi+RtqPtQou\nJbby7ft3YdRRQaOYWYWyJ+O929LXnbDmcviy/zKkGun8iYkNM0fToBaN3C4N\nXAWIDrWxNzxOFFMScfzN27JtiH5yqD3P45flBsqamvsuQnM+DXYnxvbvvMFO\n3CW28xTgfjCPLHYUzRqgkMcsLLhFSstAF/sh0cfeuv+owIFvo4fT6oGKvfEb\nZfRU9DMSHvXghJB6ZDLOgr9BY7wxpdlB8rhLUich+573X2/xNpwyP+lh77UI\nUPbjbO3vBZZY+Mak4nwFhDwcNt/sUi8l+R3CryYTbYmRG3Rl/OCta6wZGYqa\nLIq++5kVIyGSIf2IVYXs2K1S5ugTwIB91jOxHHT8B3O6PX1GyX4F2U8j7s5O\nSmK/AEYTd+KqZOnoPHjrXtHvsunh9gGcotnG97DSOSmg4QVWNl68td1h3YK6\nB5cobZMQeiXfdtixw0Oar2yAKDRsVlMq473HoNKGbg9t6GXdc85WqP6JriG4\n2p8ga7MhKS89XBpCs7zWeX0EynaMTOngwGgHDfsDIQLWaEonhRZ0A+wDi8yj\n5B8D8MkxAnUNi2ajx2mbjsntN6wvVx9f7MklvhdOcNYIM5pisr/YmgIa+nf7\nnMQgCCe1uiNecdW3oNuFOnM5+5q3GMYIhAxSTABY6klmpnCimMS5tkSo/lwX\nwmsl\r\n=g5+c\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFEQ4/PoHaFfBUFVR0k3wSMDWFxIYKAg0zRUUGIclY8kAiEAjMgcF/bRNSaI3FiwAGCKz6KFgiQREQXh9IRoMWT260M="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.23.0_1591771690788_0.637912056551043"},"_hasShrinkwrap":false},"0.24.0":{"name":"@react-ssr/nestjs-express","version":"0.24.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","peerDependencies":{"@nestjs/platform-express":"^6 || ^7","@react-ssr/core":"^0.*"},"gitHead":"8fff8d68212ed10d563fe7b9b0de6ba7000c8bee","_id":"@react-ssr/nestjs-express@0.24.0","_nodeVersion":"14.4.0","_npmVersion":"lerna/3.22.1/node@v14.4.0+x64 (darwin)","dist":{"integrity":"sha512-6VtIyUyd3l1AmnYKXCmyEzs6JvgaoqM2h2xMp3f1cwRO9BKJf/DUmgqLh5FUr/DNrLT6CqEUR8CA75nXY8R01w==","shasum":"0f8b0208482c264a2d1bfc1a3ff2081087a6a4cc","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.24.0.tgz","fileCount":8,"unpackedSize":18169,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe7S7+CRA9TVsSAnZWagAAQPAP/jlmY3O0eUS5MHdpQynz\n7pIwbBdADZF7KN1k9zI6p7ic/o1su/SadAsDSCacV6Bhm3fQqVlxPIO9G7MG\nkT7oOIuyoMVNxPIYV6N0BqouoCk1n/91HvREq0wtOPh+cnQ1T/h9TA/5as8w\nc0Nxn77rXEUCkfY9kKO1Jf9nWAgbfAFkttqPcubsXol6STMsMta2gpvgZ8O7\n2hOyyyeVRwoMMmT7iVqs88XWOOGF2PaC0qxbzHHO7+LR9y3bh/xkme7kmYQ0\nOjxBPfV+ylVa0asQtriGhgndyphW+tUy0fdfkgOvZ6y6PdqEB7xchDsR3aeI\nblCsegfRCbM5rD/n/osDY/zOB7iB96oD9pw1fTEFenZYgU0bc5F7/3LZRIwO\n1apHoZJzbhNq7O1KCVoWhhZWrdjKgwzrHefEx5CsN8QrYAUauFG+6mDahlzd\nqDACKaFyswAOMY515/Nr/SYynZMGfCzJZH83rrh5cPjVPvvdRLt02Sdaxcz6\nTqtrsgUPlBI+aJXohh9qd9MOC0B+7qXn6PIuXcX+fBHaO+KfQmmgy130JZ6M\n0+c9TLywLoa9iAiFyYy8xDXKCZMB4EWUmSsDvyEeTBn63jUREKNo4yHeaH4e\n50PN5s5eAnHySEhxtKeP1KLERkGdsa1R4NeHFfWtoBTBwOdAhQjdsxqHmFD+\nDkWa\r\n=oDrT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHTdNXNAUbhs0aO425Msmru4oYGLdoejE57PdeKydPWYAiA9fOushvLTnDEi9P4ElGtjxD9xr/P2zkkOZkFVa7ME+g=="}]},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.24.0_1592602365425_0.12297154992757742"},"_hasShrinkwrap":false},"0.25.0-canary.0":{"name":"@react-ssr/nestjs-express","version":"0.25.0-canary.0","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","peerDependencies":{"@nestjs/platform-express":"6 - 9","@react-ssr/core":"*"},"types":"./index.d.ts","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\nBecause it is just a view template engine:\n\n- It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n- It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n- We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom `process.env.NODE_ENV`\n\nIf you set `process.env.REACT_SSR_ENV`, you can separate `process.env.NODE_ENV` from react-ssr:\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=k8s REACT_SSR_ENV=production node dist/main.js\"\n  }\n}\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n### @react-ssr/express\n\n**.jsx**\n\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n- [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n- [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n- [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-multiple-view-engines](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-multiple-view-engines)\n- [examples/support-yarn2-pnp](https://github.com/saltyshiomix/react-ssr/tree/master/examples/support-yarn2-pnp)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n**.tsx**\n\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/with-tsx-redux-todo](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-tsx-redux-todo)\n\n### @react-ssr/nestjs-express\n\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n\n## Real World Examples\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n- [react-ssr-redux-todo-app](https://github.com/saltyshiomix/react-ssr-redux-todo-app)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n\n## Contact\n\n- via [GitHub Issues](https://github.com/saltyshiomix/react-ssr/issues)\n- via [Twitter](https://twitter.com/saltyshiomix)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.25.0-canary.0","_integrity":"sha512-OtrwEz5v/l8WchrXsoPpKPcGgBbROEyS6mKOE6TXyL88Rwc0IDp2ioDKRWC7U2XPlEb5lIsdr8kRHN50deeZOg==","_resolved":"/private/var/folders/mv/4xdry6ln4sd2lpr2ys20zj1m0000gp/T/9460232876cafd460cd34b672db0ceb3/react-ssr-nestjs-express-0.25.0-canary.0.tgz","_from":"file:react-ssr-nestjs-express-0.25.0-canary.0.tgz","_nodeVersion":"16.17.0","_npmVersion":"8.15.0","dist":{"integrity":"sha512-OtrwEz5v/l8WchrXsoPpKPcGgBbROEyS6mKOE6TXyL88Rwc0IDp2ioDKRWC7U2XPlEb5lIsdr8kRHN50deeZOg==","shasum":"238e0e7fcd26d026b50265c6d76937c73bcb763f","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.25.0-canary.0.tgz","fileCount":8,"unpackedSize":18114,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGWgL4LyIGlxYz8AE9iAlMEH1aqCojBxa6tlz4zKuPnmAiEAkwb1XLSYdWKgOeavLnylUyo5kl8B24KQ18S9agtYiSM="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjELkAACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqILQ//XcxZHO1catiFCDrYhJfcwrC84dW3+Lg3cezZrL/djD7S61Qy\r\nUpBuBnPs5qgiWuZtUZrarUaSeUzNZqcJsFz8TgWIWESjjp2FxHEtZRG0KLey\r\nZA798tHIY2ixq65tx3m01pkG27dTW28Ig/oTeA0fL8hCthRu3LidDU4HlBtV\r\nI9s6VHGjgzGTIgtdP1B5/oAMmjcJ+b8dB1Jik+QV6IGxssuZCL6Mdzp8GVA2\r\nOUHSXo7itafoKGzcDZzG9+CxJZFz1i0XDCxect0/sH3Hzo58dWvKI6Uib9HB\r\nkL5uqK47bolbL8MGj6FYC+47dIWs+H+ZYcOHsN+WuUB9C9Pt78YAKrx7c93r\r\n/OsBWPzaNMFtGpG24YQFDS8CTizE+osOxvlVwxteTcPHe7HZ2yf7qYSj8Jg6\r\nJmaIc2xIlcCeYfdG2Nb7EbLoIS2/SO1E6qr2OkAmR47exhJtZT2Um3x6BItD\r\nhy+tPLYeZPjLCoqPOZPJyVNsafL0+YfbGE25qm+yE8g9hDnx99ECrw4+GgA/\r\naum+7pEQuFEJyEiVAkbN6fDftnwUZvp7q7ZANYruBV81cLjYCYpVowt5A+EF\r\nuZMT5rKlWbwGOAzVvVl+wTxoVjyziwlOWtCRKjhWR+4jwYE7HyrFo9idO+Bz\r\ngG5RLM5HzjXq/k9VZPOuz1OoeYATr13RzCg=\r\n=eV2D\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.25.0-canary.0_1662040319838_0.006185486558786035"},"_hasShrinkwrap":false},"0.25.0-canary.1":{"name":"@react-ssr/nestjs-express","version":"0.25.0-canary.1","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","peerDependencies":{"@nestjs/platform-express":"6 - 9","@react-ssr/core":"*"},"types":"./index.d.ts","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\nBecause it is just a view template engine:\n\n- It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n- It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n- We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom `process.env.NODE_ENV`\n\nIf you set `process.env.REACT_SSR_ENV`, you can separate `process.env.NODE_ENV` from react-ssr:\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=k8s REACT_SSR_ENV=production node dist/main.js\"\n  }\n}\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n### @react-ssr/express\n\n**.jsx**\n\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n- [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n- [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n- [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-multiple-view-engines](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-multiple-view-engines)\n- [examples/support-yarn2-pnp](https://github.com/saltyshiomix/react-ssr/tree/master/examples/support-yarn2-pnp)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n**.tsx**\n\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/with-tsx-redux-todo](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-tsx-redux-todo)\n\n### @react-ssr/nestjs-express\n\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n\n## Real World Examples\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n- [react-ssr-redux-todo-app](https://github.com/saltyshiomix/react-ssr-redux-todo-app)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n\n## Contact\n\n- via [GitHub Issues](https://github.com/saltyshiomix/react-ssr/issues)\n- via [Twitter](https://twitter.com/saltyshiomix)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.25.0-canary.1","_integrity":"sha512-WrQldEy7dM3D6PhGUYIOzaTO8Yd8c1pBG7FWuFdZGGpsVkxrxGe9kZqNMm0kXILJ0k46Fbf4/dbkR4XioqCYdA==","_resolved":"/private/var/folders/mv/4xdry6ln4sd2lpr2ys20zj1m0000gp/T/a36ef4c24f21c258ac9d2bd50ca13212/react-ssr-nestjs-express-0.25.0-canary.1.tgz","_from":"file:react-ssr-nestjs-express-0.25.0-canary.1.tgz","_nodeVersion":"16.17.0","_npmVersion":"8.15.0","dist":{"integrity":"sha512-WrQldEy7dM3D6PhGUYIOzaTO8Yd8c1pBG7FWuFdZGGpsVkxrxGe9kZqNMm0kXILJ0k46Fbf4/dbkR4XioqCYdA==","shasum":"e0632d089a8f0f17d6e930a69b8da83781ac8d30","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.25.0-canary.1.tgz","fileCount":8,"unpackedSize":18114,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBQSjqAWlkZ30Jtb2xGfMGiNWidbAb9VGvC9kjPCNyPGAiAUrZ1WeqtMTt+luiEXiMCLR0k8H8FuYNXoz/X4ABLYng=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjELnfACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmro3Q/9GZePFVTzd5Aj12+fKgh00ewJAj/EYS4h6M37iZGhtwOLCB9Z\r\nOx6weDlGyAGvMoh7LLY/Gztth/dkv4Lis4vEYJQuhczxaG4sNFXVK5Oq/dx+\r\nrWWFqIglyHY+q0Nwis47SSuA+QkRzXJDw7oonBKNFf33ZJhytXqperUhjR1k\r\nb4mG38sv93Iq00wCm/3gNkKazY0TB9YmSEI63JUdfIv1bcFRYCUf9gwgRPJa\r\nsTXFkL4HKFJ+eNBRA3BT/1spokJM8ToImVBz9ie7s3HWk5OkLSKUpdL0bV0s\r\n1s6LnazH69WFykJkrXY7iNHzSrKv/y3qWvJP+5w3vePWR6ME/ON8c+3PE5IE\r\nlB9M/+TC/iGgEtXmWqlMVgtbNMEpFm6aAa0GQDpzzSrKhnrwW75Oggy/SFj3\r\ny2Os8eqgmJQ6dZ5/JZk54azQjybHHL8yE8I49I+IBwfb2GFhhC0YoTdakUzj\r\ndNOdf/MLRvCN8Kg4Ml2o0qvszZXfb4PHxhJD4U8g43FYrw26YzcWw5yzSF4R\r\nY93Hqrx5ipbvwdOe/GE+LCaVjCesiOrQDSAoIcNM9CMR6lgTnbHex4w2xY1V\r\ng7T7KpZB5R0J49oee6RyDQHXl7dpSivY0Oz9ghnpoEFsUIOkgKjVvgAF6dv/\r\nARHC5ajy1sOVMVweKTJ7Bagj9v0caBCycCw=\r\n=miYq\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.25.0-canary.1_1662040543628_0.5111026080728736"},"_hasShrinkwrap":false},"0.25.0-canary.2":{"name":"@react-ssr/nestjs-express","version":"0.25.0-canary.2","description":"React SSR as a view template engine","repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"license":"MIT","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"publishConfig":{"access":"public"},"main":"index.js","peerDependencies":{"@nestjs/platform-express":"6 - 9","@react-ssr/core":"*"},"types":"./index.d.ts","readme":"## Overview\n\n- SSR (Server Side Rendering) as a view template engine\n- Dynamic `props`\n  - Passing the server data to the React client `props`\n  - Suitable for:\n    - Admin Panels\n    - Blogging\n- Developer Experience\n  - Zero config of webpack and babel\n  - HMR (Hot Module Replacement) both scripts and even if styles when `process.env.NODE_ENV !== 'production'`\n  - Built-in Sass (SCSS) support\n\n## Pros and Cons\n\n### Pros\n\nBecause it is just a view template engine:\n\n- It doesn't need to have any APIs, all we have to do is to pass the server data to the client\n- It supports multiple engines like `.hbs`, `.ejs` and React `.(ts|js)x`\n- We can use [passport](http://www.passportjs.org) authentication as it always is\n\n### Cons\n\n- It is not so performant, because it assembles the whole HTML on each request\n- It does not support **client side routing**\n\n## Usage\n\nInstall it:\n\n```bash\n# install NestJS dependencies\n$ npm install --save @nestjs/core @nestjs/common @nestjs/platform-express reflect-metadata rxjs\n\n# install @react-ssr/nestjs-express\n$ npm install --save @react-ssr/core @react-ssr/nestjs-express react react-dom\n```\n\nAnd add a script to your package.json like this:\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"ts-node --project tsconfig.server.json server/main.ts\"\n  }\n}\n```\n\nThen, populate files below inside your project:\n\n**`tsconfig.json`**:\n\n```json\n{\n  \"compilerOptions\": {\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"jsx\": \"preserve\",\n    \"lib\": [\n      \"dom\",\n      \"dom.iterable\",\n      \"esnext\"\n    ],\n    \"strict\": true,\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"emitDecoratorMetadata\": true,\n    \"experimentalDecorators\": true\n  },\n  \"exclude\": [\n    \"node_modules\",\n    \"ssr.config.js\",\n    \"dist\",\n    \".ssr\"\n  ]\n}\n```\n\n**`tsconfig.server.json`**:\n\n```json\n{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    \"module\": \"commonjs\",\n    \"outDir\": \"dist\"\n  },\n  \"include\": [\n    \"server\"\n  ]\n}\n```\n\n**`server/main.ts`**:\n\n```ts\nimport { NestFactory } from '@nestjs/core';\nimport { NestExpressApplication } from '@nestjs/platform-express';\nimport register from '@react-ssr/nestjs-express/register';\nimport { AppModule } from './app.module';\n\n(async () => {\n  const app = await NestFactory.create<NestExpressApplication>(AppModule);\n\n  // register `.tsx` as a view template engine\n  await register(app);\n\n  app.listen(3000, async () => {\n    console.log(`> Ready on http://localhost:3000`);\n  });\n})();\n```\n\n**`server/app.module.ts`**:\n\n```ts\nimport { Module } from '@nestjs/common';\nimport { AppController } from './app.controller';\n\n@Module({\n  controllers: [\n    AppController,\n  ],\n})\nexport class AppModule {}\n```\n\n**`server/app.controller.ts`**:\n\n```ts\nimport {\n  Controller,\n  Get,\n  Render,\n} from '@nestjs/common';\n\n@Controller()\nexport class AppController {\n  @Get()\n  @Render('index') // this will render `views/index.tsx`\n  public showHome() {\n    const user = { name: 'NestJS' };\n    return { user };\n  }\n}\n```\n\n**`views/index.tsx`**:\n\n```tsx\ninterface IndexProps {\n  user: any;\n}\n\nconst Index = ({ user }: IndexProps) => {\n  return <p>Hello {user.name}!</p>;\n};\n\nexport default Index;\n```\n\nFinally, just run `npm start` and go to `http://localhost:3000`, and you'll see `Hello NestJS!`.\n\n## Configuration (`ssr.config.js`)\n\nHere is the default `ssr.config.js`, which is used by `react-ssr` when there are no valid values:\n\n```js\nmodule.exports = {\n  id: 'default',\n  distDir: '.ssr',\n  viewsDir: 'views',\n  staticViews: [],\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    return config;\n  },\n};\n```\n\n### `ssr.config.js#id`\n\nThe id of **UI framework**. (default: `default`)\n\nIt can be ignored only when the project does not use any UI frameworks.\n\nSupported UI frameworks are:\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\nFor example, if we want to use `emotion`, `ssr.config.js` is like this:\n\n```js\nmodule.exports = {\n  id: 'emotion',\n};\n```\n\n### `ssr.config.js#distDir`\n\nThe place where `react-ssr` generates **production** results. (default: `.ssr`)\n\nIf we use TypeScript or any other library which must be compiled, the config below may be useful:\n\n```js\nmodule.exports = {\n  // dist folder should be ignored by `.gitignore`\n  distDir: 'dist/.ssr',\n};\n```\n\n### `ssr.config.js#viewsDir`\n\nThe place where we put views. (default: `views`)\n\nA function `res.render('xxx')` will render `views/xxx.jsx` or `views/xxx.tsx`.\n\nA working example is here: [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n\n### `ssr.config.js#staticViews`\n\nIf specified, `react-ssr` generates html cache when production:\n\n```js\nmodule.exports = {\n  staticViews: [\n    'auth/login',\n    'auth/register',\n    'about',\n  ],\n};\n```\n\n### `ssr.config.js#webpack()`\n\n```js\nmodule.exports = {\n  webpack: (config /* webpack.Configuration */, env /* 'development' | 'production' */) => {\n    // we can override default webpack config here\n    return config;\n  },\n};\n```\n\n## Custom `process.env.NODE_ENV`\n\nIf you set `process.env.REACT_SSR_ENV`, you can separate `process.env.NODE_ENV` from react-ssr:\n\n**package.json**\n\n```json\n{\n  \"scripts\": {\n    \"start\": \"cross-env NODE_ENV=k8s REACT_SSR_ENV=production node dist/main.js\"\n  }\n}\n```\n\n## Custom Babel Config\n\nWe can extends its default `.babelrc` like this:\n\n**`.babelrc`**:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/nestjs-express/babel\"\n  ]\n}\n```\n\nA working example is here: [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n\n## Custom App\n\nJust put `_app.tsx` into the views root:\n\n**`views/_app.tsx`**:\n\n```jsx\n// we can import global styles or use theming\nimport '../styles/global.scss';\n\nconst App = (props) => {\n  // yes, this `props` contains data passed from the server\n  // and also we can inject additional data into pages\n  const { children, ...rest } = props;\n\n  // we can wrap this PageComponent for persisting layout between page changes\n  const PageComponent = children;\n\n  return <PageComponent {...rest} />;\n};\n\nexport default App;\n```\n\nA working example is here:\n\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n## Custom Document\n\nJust put `_document.tsx` into the views root:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/nestjs-express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html lang=\"en\">\n        <Head>\n          <title>Default Title</title>\n          <meta charSet=\"utf-8\" />\n          <meta name=\"viewport\" content=\"minimum-scale=1, initial-scale=1, width=device-width\" />\n          <link rel=\"shortcut icon\" href=\"/favicon.ico\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n};\n```\n\n**Note**:\n\n- **Please put `<Main />` component directly under `<body>` tag and don't wrap `<Main />` component with another components**, because this is a hydration target for the client.\n\nAnd then, use it as always:\n\n**`views/index.tsx`**:\n\n```tsx\nconst Index = (props) => {\n  return <p>Hello World!</p>;\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n\n## Dynamic `Head`\n\nWe can use the `Head` component in any pages:\n\n**`views/index.tsx`**:\n\n```tsx\nimport React from 'react';\nimport { Head } from '@react-ssr/nestjs-express';\n\nconst Index = (props) => {\n  return (\n    <React.Fragment>\n      <Head>\n        <title>Dynamic Title</title>\n        <meta name=\"description\" content=\"Dynamic Description\" />\n      </Head>\n      <p>Of course, SSR Ready!</p>\n    </React.Fragment>\n  );\n};\n\nexport default Index;\n```\n\nA working example is here: [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n\n## Supported UI Framework\n\n- [x] default (the id `default` doesn't need to be specified in `ssr.config.js`)\n  - [x] [bulma](https://bulma.io)\n  - [x] [semantic-ui](https://react.semantic-ui.com)\n  - [x] Or any other **non** CSS-in-JS UI frameworks\n- [x] [emotion](https://emotion.sh)\n- [x] [styled-components](https://www.styled-components.com)\n- [x] [material-ui](https://material-ui.com)\n- [x] [antd](https://ant.design)\n- [ ] and more...\n\n### Non CSS-in-JS framework\n\n<p align=\"center\"><img src=\"https://i.imgur.com/0PwlfVk.png\"></p>\n\nLike [semantic-ui](https://react.semantic-ui.com), non CSS-in-JS frameworks are supported without extra configuration.\n\nAll we have to do is to load global CSS in `_document` or each page:\n\n**`views/_document.tsx`**:\n\n```tsx\nimport React from 'react';\nimport {\n  Document,\n  Head,\n  Main,\n} from '@react-ssr/express';\n\nexport default class extends Document {\n  render() {\n    return (\n      <html>\n        <Head>\n          <title>A Sample of Semantic UI React</title>\n          <link rel=\"stylesheet\" href=\"//cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css\" />\n        </Head>\n        <body>\n          <Main />\n        </body>\n      </html>\n    );\n  }\n}\n```\n\n### With Ant Design\n\n<p align=\"center\"><img src=\"https://i.imgur.com/yWGxseM.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-import` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    [\n      \"import\",\n      {\n        \"libraryName\": \"antd\",\n        \"style\": \"css\"\n      }\n    ]\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n\n### With Emotion\n\n<p align=\"center\"><img src=\"https://i.imgur.com/XN8evEM.png\"></p>\n\nIn order to enable SSR, we must install these packages:\n\n- [@emotion/cache](https://npm.im/@emotion/cache) as **dependencies**\n- [create-emotion-server](https://npm.im/create-emotion-server) as **dependencies**\n- [babel-plugin-emotion](https://npm.im/babel-plugin-emotion) as devDependencies\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"emotion\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n\n### With Material UI\n\n<p align=\"center\"><img src=\"https://i.imgur.com/o1AWdyd.png\"></p>\n\nWe can use [material-ui](https://material-ui.com) without extra configuration.\n\nA working example is here: [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n\n### With styled-components\n\n<p align=\"center\"><img src=\"https://i.imgur.com/RtuijYA.png\"></p>\n\nIn order to enable SSR, we must install `babel-plugin-styled-components` as devDependencies.\n\nAnd then, populate `.babelrc` in your project root:\n\n```json\n{\n  \"presets\": [\n    \"@react-ssr/express/babel\"\n  ],\n  \"plugins\": [\n    \"styled-components\"\n  ]\n}\n```\n\nA working example is here: [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n## Examples\n\n### @react-ssr/express\n\n**.jsx**\n\n- [examples/basic-jsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-jsx)\n- [examples/basic-custom-app](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-app)\n- [examples/basic-custom-babelrc](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-babelrc)\n- [examples/basic-custom-document](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-document)\n- [examples/basic-custom-views](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-custom-views)\n- [examples/basic-dynamic-head](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-dynamic-head)\n- [examples/basic-hmr-css](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-css)\n- [examples/basic-hmr-scss](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-hmr-scss)\n- [examples/basic-blogging](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-blogging)\n- [examples/basic-multiple-view-engines](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-multiple-view-engines)\n- [examples/support-yarn2-pnp](https://github.com/saltyshiomix/react-ssr/tree/master/examples/support-yarn2-pnp)\n- [examples/with-jsx-antd](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-antd)\n- [examples/with-jsx-bulma](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-bulma)\n- [examples/with-jsx-emotion](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-emotion)\n- [examples/with-jsx-material-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-material-ui)\n- [examples/with-jsx-semantic-ui](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-semantic-ui)\n- [examples/with-jsx-styled-components](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-jsx-styled-components)\n\n**.tsx**\n\n- [examples/basic-tsx](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-tsx)\n- [examples/with-tsx-redux-todo](https://github.com/saltyshiomix/react-ssr/tree/master/examples/with-tsx-redux-todo)\n\n### @react-ssr/nestjs-express\n\n- [examples/basic-nestjs](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs)\n- [examples/basic-nestjs-nodemon](https://github.com/saltyshiomix/react-ssr/tree/master/examples/basic-nestjs-nodemon)\n\n## Real World Examples\n\n- [react-ssr-jsx-starter](https://github.com/saltyshiomix/react-ssr-jsx-starter)\n- [react-ssr-tsx-starter](https://github.com/saltyshiomix/react-ssr-tsx-starter)\n- [react-ssr-nestjs-starter](https://github.com/saltyshiomix/react-ssr-nestjs-starter)\n- [react-ssr-redux-todo-app](https://github.com/saltyshiomix/react-ssr-redux-todo-app)\n\n## Articles\n\n[Introducing an Alternative to NEXT.js](https://dev.to/saltyshiomix/introducing-an-alternative-to-next-js-12ph)\n\n[[Express] React as a View Template Engine?](https://dev.to/saltyshiomix/express-react-as-a-view-template-engine-h37)\n\n## Related\n\n[reactjs/express-react-views](https://github.com/reactjs/express-react-views)\n\n## Contact\n\n- via [GitHub Issues](https://github.com/saltyshiomix/react-ssr/issues)\n- via [Twitter](https://twitter.com/saltyshiomix)\n","readmeFilename":"README.md","_id":"@react-ssr/nestjs-express@0.25.0-canary.2","_integrity":"sha512-dsWL3Ua3demgpHBBUmj56ss+cDA2+JWZq6FFLkAOy+7bXUb9EeFVT4M2yShdDic0DukvldgZYlkKeywrobcPXw==","_resolved":"/private/var/folders/mv/4xdry6ln4sd2lpr2ys20zj1m0000gp/T/4f37370592a2bf142ee59eba1c4ddde9/react-ssr-nestjs-express-0.25.0-canary.2.tgz","_from":"file:react-ssr-nestjs-express-0.25.0-canary.2.tgz","_nodeVersion":"16.17.0","_npmVersion":"8.15.0","dist":{"integrity":"sha512-dsWL3Ua3demgpHBBUmj56ss+cDA2+JWZq6FFLkAOy+7bXUb9EeFVT4M2yShdDic0DukvldgZYlkKeywrobcPXw==","shasum":"148e1aef91fd25540a055bf042326d951276106d","tarball":"https://registry.npmjs.org/@react-ssr/nestjs-express/-/nestjs-express-0.25.0-canary.2.tgz","fileCount":8,"unpackedSize":18114,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC3SHf7JabpEjXoL8HcJqh0JVKYwncYfjEpbTjp1efw7wIhAI6Hn+H4d+otqtMn3S1btVvzovueJYzAznqL8h824wd/"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjELrzACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpFeQ//RKexSvkAyBxugM2MiVmDiypjaFBp7X+3U9NjZzKQYtxi5+RM\r\nZ44tscaYm3Pk9n7jCnayK1Xmjv0a1p5izZovrdsn+gz/6mPKV2RBOpOXm/Ct\r\nVjxyiyOYZWOusejtYBa19hSbGrd8DHss8NwPrRiRJv/lnlL9EksyJ9lZhKNb\r\nRfTPkH/RvLhqpY3TBMdNN83fKQayZACui9m0hRuWQGZaqMrcpvG3hfCB3euo\r\ntvulm1aPMyXXwUnAfYupOnRBa6q7YABVWhtJWc8rT7LMHIG0UYd8UV+bcVZX\r\nuFeNk6KklKF/VJSbGjSLeSfzIwHmOlYtTxfDfXrgFRjGZd3RC8K78vcDzMaR\r\nx5n48OP5YgjBFrO8bkPdSjmLw+aFrOMbTP+1dIpvphAlxPAnyWbsspPuhxGR\r\n4AB8VDOOW0fRsNOl8Ap+yk+piwfyGcBKwgDAu8vunmxlAZqihaOLH3v9KQGO\r\nEYFaNgIVlGQHz/Qc5Q7anXGreKANVTR/86VYxNs6Y7g9HT/mVTVSLiA71014\r\nDErXufNxPyYBytij1aApIGQZtVfLUEbIUAtsLeAV5HxgMipuS2zCZ/wVqrUb\r\nyli9rozEhUdsFxCUX0M3FlwLeQ16adbuBrW51KwRNcDmuwB7OVsnx4a7qZ7b\r\nvZzu0YwhEDjw4OSATqL3WuldAkRXkvLbKeI=\r\n=H6ZS\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"},"directories":{},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/nestjs-express_0.25.0-canary.2_1662040819123_0.899645626158682"},"_hasShrinkwrap":false}},"time":{"created":"2019-10-21T14:39:34.126Z","0.5.14":"2019-10-21T14:39:34.435Z","modified":"2022-09-01T14:00:19.371Z","0.5.15-alpha.0":"2019-10-21T21:14:34.497Z","0.5.15-alpha.1":"2019-10-21T21:18:39.535Z","0.5.15-alpha.2":"2019-10-21T21:22:26.786Z","0.5.15-alpha.3":"2019-10-21T21:29:13.244Z","0.5.15-alpha.4":"2019-10-21T21:38:05.850Z","0.5.15-alpha.5":"2019-10-21T21:39:11.490Z","0.5.15-alpha.6":"2019-10-21T21:42:33.636Z","0.5.15-alpha.7":"2019-10-22T05:37:11.136Z","0.5.15-alpha.8":"2019-10-22T05:39:01.063Z","0.5.15-alpha.9":"2019-10-22T05:40:03.895Z","0.5.15-alpha.10":"2019-10-22T05:41:27.381Z","0.5.15-alpha.11":"2019-10-22T05:42:31.164Z","0.5.15-alpha.12":"2019-10-22T05:44:16.513Z","0.5.15-alpha.13":"2019-10-22T05:45:48.662Z","0.5.15-alpha.14":"2019-10-22T05:52:17.840Z","0.5.15-alpha.15":"2019-10-22T05:55:59.513Z","0.5.15-alpha.16":"2019-10-22T05:59:49.532Z","0.5.15-alpha.17":"2019-10-22T06:05:44.976Z","0.5.15-alpha.18":"2019-10-22T06:10:45.571Z","0.5.15-alpha.19":"2019-10-22T06:31:21.504Z","0.5.15-alpha.20":"2019-10-22T07:54:07.657Z","0.5.15-alpha.21":"2019-10-22T08:11:21.986Z","0.5.15-alpha.22":"2019-10-22T08:46:19.623Z","0.5.15-alpha.69":"2019-10-22T14:40:02.902Z","0.5.15-alpha.70":"2019-10-22T14:47:25.603Z","0.5.15-alpha.103":"2019-10-22T18:05:40.453Z","0.5.15-alpha.178":"2019-10-23T22:57:04.310Z","0.5.15-alpha.179":"2019-10-23T23:03:56.532Z","0.5.15":"2019-10-23T23:05:58.466Z","0.6.0":"2019-10-24T06:30:19.753Z","0.6.1":"2019-10-24T06:40:07.969Z","0.6.2-alpha.6":"2019-10-24T13:50:21.935Z","0.6.2":"2019-10-24T14:14:09.652Z","0.6.3-alpha.0":"2019-10-24T14:38:26.995Z","0.6.3-alpha.1":"2019-10-24T14:46:00.978Z","0.6.3-alpha.2":"2019-10-24T14:47:47.926Z","0.6.3-alpha.3":"2019-10-24T14:52:11.321Z","0.6.3-alpha.4":"2019-10-24T14:56:45.430Z","0.6.3":"2019-10-24T14:59:20.664Z","0.6.4-alpha.1":"2019-10-24T18:54:32.509Z","0.6.4":"2019-10-24T18:55:25.342Z","0.6.5":"2019-10-24T19:01:03.559Z","0.7.0":"2019-10-26T01:26:13.106Z","0.7.1":"2019-10-26T09:32:06.739Z","0.7.2":"2019-10-28T06:47:06.921Z","0.7.3":"2019-10-28T06:56:49.400Z","0.7.4":"2019-10-28T07:02:02.508Z","0.7.5":"2019-10-28T07:05:09.855Z","0.7.6":"2019-10-28T11:57:41.373Z","0.7.7":"2019-10-28T12:16:40.913Z","0.7.8":"2019-10-28T12:29:44.943Z","0.7.9":"2019-10-28T12:42:22.984Z","0.7.10":"2019-10-28T12:52:54.991Z","0.7.11":"2019-10-28T13:32:33.005Z","0.7.12":"2019-10-28T19:19:05.982Z","0.7.13":"2019-10-28T19:27:13.990Z","0.7.14":"2019-10-28T19:35:11.488Z","0.7.15":"2019-10-28T19:37:35.371Z","0.7.16":"2019-10-28T19:41:27.556Z","0.7.17":"2019-10-28T19:44:22.754Z","0.7.18":"2019-10-28T20:09:36.429Z","0.7.19":"2019-10-28T20:13:05.185Z","0.7.20":"2019-10-28T20:16:37.045Z","0.7.21":"2019-10-28T20:18:30.784Z","0.7.22":"2019-10-28T20:30:33.239Z","0.7.23":"2019-10-28T20:35:59.436Z","0.7.24":"2019-10-28T20:39:29.324Z","0.7.25":"2019-10-28T20:50:42.421Z","0.7.26":"2019-10-28T20:56:13.376Z","0.7.27":"2019-10-28T20:59:49.315Z","0.7.28":"2019-10-28T21:10:31.734Z","0.7.29":"2019-10-28T21:13:25.670Z","0.7.30":"2019-10-28T21:17:23.163Z","0.7.31":"2019-10-28T21:24:25.410Z","0.7.32":"2019-10-28T21:26:44.336Z","0.7.33":"2019-10-28T21:31:18.971Z","0.7.34":"2019-10-28T21:33:45.540Z","0.7.35":"2019-10-28T21:36:18.591Z","0.7.36":"2019-10-28T21:38:42.929Z","0.7.37":"2019-10-28T21:41:32.696Z","0.7.38":"2019-10-28T21:45:23.437Z","0.7.39":"2019-10-28T21:52:31.791Z","0.7.40":"2019-10-28T21:55:09.009Z","0.7.41":"2019-10-28T22:19:57.432Z","0.7.42":"2019-10-28T22:33:54.616Z","0.7.43":"2019-10-28T22:41:24.070Z","0.7.44":"2019-10-28T22:47:20.226Z","0.7.45":"2019-10-28T22:49:09.690Z","0.7.46":"2019-10-28T22:51:33.109Z","0.7.47":"2019-10-28T22:57:03.186Z","0.7.48":"2019-10-28T23:03:12.433Z","0.7.49":"2019-10-28T23:07:31.338Z","0.7.50":"2019-10-28T23:12:18.867Z","0.7.51":"2019-10-28T23:17:22.721Z","0.7.52":"2019-10-28T23:19:14.520Z","0.7.53":"2019-10-28T23:21:13.500Z","0.7.54":"2019-10-28T23:24:54.896Z","0.7.55":"2019-10-28T23:28:22.799Z","0.7.56":"2019-10-28T23:30:51.693Z","0.7.57":"2019-10-28T23:35:34.096Z","0.7.58":"2019-10-28T23:42:55.461Z","0.7.59":"2019-10-28T23:49:26.266Z","0.7.60":"2019-10-28T23:54:12.079Z","0.7.61":"2019-10-29T00:06:14.107Z","0.7.62":"2019-10-29T04:12:12.250Z","0.7.65":"2019-10-29T05:17:02.357Z","0.7.66":"2019-10-29T05:19:07.707Z","0.7.67":"2019-10-29T05:20:15.346Z","0.7.68":"2019-10-29T05:24:28.144Z","0.7.69":"2019-10-29T05:32:40.494Z","0.8.0":"2019-10-29T06:08:57.522Z","0.8.1-alpha.25":"2019-11-01T01:10:18.023Z","0.8.1-alpha.26":"2019-11-01T01:16:37.548Z","0.8.1-alpha.27":"2019-11-01T01:22:12.913Z","0.8.1-alpha.28":"2019-11-01T01:25:14.998Z","0.8.1-alpha.29":"2019-11-01T01:29:07.062Z","0.8.1-alpha.30":"2019-11-01T01:43:54.408Z","0.9.0":"2019-11-01T02:47:22.482Z","0.9.1":"2019-11-01T02:50:58.811Z","0.9.2":"2019-11-01T03:08:30.827Z","0.9.3":"2019-11-01T03:18:45.164Z","0.9.4":"2019-11-01T03:23:48.251Z","0.9.5":"2019-11-01T03:26:24.979Z","0.9.6":"2019-11-01T03:36:24.195Z","0.9.7":"2019-11-01T03:38:51.186Z","0.9.8":"2019-11-01T03:44:48.913Z","0.9.9":"2019-11-01T03:47:02.762Z","0.9.10":"2019-11-01T03:52:27.307Z","0.9.11":"2019-11-01T03:54:09.952Z","0.9.12":"2019-11-01T03:56:38.029Z","0.9.13":"2019-11-01T04:02:48.213Z","0.9.14":"2019-11-01T04:08:08.762Z","0.9.15-alpha.3":"2019-11-01T05:18:09.447Z","0.9.15-alpha.5":"2019-11-01T05:21:59.738Z","0.9.15-alpha.7":"2019-11-01T05:29:10.610Z","0.9.15-alpha.8":"2019-11-01T05:32:02.128Z","0.9.15-alpha.10":"2019-11-01T05:38:21.179Z","0.9.15-alpha.11":"2019-11-01T05:40:19.929Z","0.9.15-alpha.13":"2019-11-01T05:52:30.381Z","0.9.15-alpha.15":"2019-11-01T05:54:57.721Z","0.9.15-alpha.16":"2019-11-01T06:00:25.185Z","0.9.15-alpha.17":"2019-11-01T06:02:48.021Z","0.9.15-alpha.18":"2019-11-01T06:04:32.343Z","0.9.15-alpha.19":"2019-11-01T06:06:06.884Z","0.9.15-alpha.20":"2019-11-01T06:28:31.836Z","0.9.15-alpha.21":"2019-11-01T06:30:38.777Z","0.9.15-alpha.22":"2019-11-01T06:33:02.946Z","0.9.15-alpha.23":"2019-11-01T06:46:57.155Z","0.9.15-alpha.24":"2019-11-01T07:07:57.935Z","0.9.15-alpha.26":"2019-11-01T07:12:23.443Z","0.9.15-alpha.27":"2019-11-01T07:13:33.564Z","0.9.15-alpha.28":"2019-11-01T07:18:53.443Z","0.9.15-alpha.29":"2019-11-01T07:43:04.366Z","0.9.15-alpha.30":"2019-11-01T07:46:43.150Z","0.9.15-alpha.31":"2019-11-01T07:50:56.895Z","0.9.15-alpha.32":"2019-11-01T08:01:42.230Z","0.9.15-alpha.33":"2019-11-01T08:05:03.127Z","0.9.15-alpha.34":"2019-11-01T08:21:52.435Z","0.9.15-alpha.35":"2019-11-01T08:23:40.078Z","0.9.15-alpha.36":"2019-11-01T08:30:56.437Z","0.9.15-alpha.37":"2019-11-01T08:47:14.091Z","0.9.15-alpha.38":"2019-11-01T08:55:36.118Z","0.10.0":"2019-11-01T09:19:40.157Z","0.10.1":"2019-11-01T09:30:57.573Z","0.10.2-alpha.0":"2019-11-01T11:46:43.801Z","0.10.2-alpha.1":"2019-11-01T11:53:12.973Z","0.10.2-alpha.2":"2019-11-01T11:56:17.436Z","0.10.2-alpha.4":"2019-11-01T12:01:02.513Z","0.10.2-alpha.5":"2019-11-01T12:12:54.288Z","0.10.2-alpha.6":"2019-11-01T12:14:31.581Z","0.10.2-alpha.7":"2019-11-01T12:20:14.001Z","0.10.2-alpha.8":"2019-11-01T12:28:33.597Z","0.10.2-alpha.9":"2019-11-01T12:30:28.907Z","0.10.2-alpha.10":"2019-11-01T12:32:47.764Z","0.10.2-alpha.11":"2019-11-01T12:33:53.073Z","0.10.2-alpha.12":"2019-11-01T12:38:06.088Z","0.10.2-alpha.13":"2019-11-01T12:43:26.976Z","0.10.2-alpha.14":"2019-11-01T12:52:12.904Z","0.10.2-alpha.15":"2019-11-01T12:54:48.521Z","0.10.2-alpha.16":"2019-11-01T12:58:31.968Z","0.10.2-alpha.17":"2019-11-01T13:00:39.679Z","0.10.2-alpha.18":"2019-11-01T13:02:34.702Z","0.10.2-alpha.19":"2019-11-01T13:08:38.503Z","0.10.2-alpha.20":"2019-11-01T13:09:41.170Z","0.10.2-alpha.21":"2019-11-01T13:13:15.883Z","0.10.2-alpha.22":"2019-11-01T13:19:57.804Z","0.10.2-alpha.23":"2019-11-01T13:21:08.359Z","0.10.2-alpha.24":"2019-11-01T13:28:30.385Z","0.10.2-alpha.25":"2019-11-01T13:37:46.171Z","0.10.2-alpha.26":"2019-11-01T13:40:15.597Z","0.10.2-alpha.27":"2019-11-01T13:49:33.300Z","0.10.2-alpha.28":"2019-11-01T13:52:09.119Z","0.10.2-alpha.29":"2019-11-01T13:53:42.457Z","0.10.2-alpha.30":"2019-11-01T13:57:03.313Z","0.10.2-alpha.31":"2019-11-01T13:59:20.944Z","0.10.2-alpha.32":"2019-11-01T14:01:22.773Z","0.10.2-alpha.33":"2019-11-01T14:03:44.786Z","0.10.2-alpha.34":"2019-11-01T14:12:54.906Z","0.10.2-alpha.35":"2019-11-01T14:14:22.727Z","0.10.2-alpha.36":"2019-11-01T14:16:24.683Z","0.10.2-alpha.37":"2019-11-01T14:19:14.711Z","0.10.2-alpha.38":"2019-11-01T14:23:22.827Z","0.10.2":"2019-11-01T14:27:32.111Z","0.10.3":"2019-11-02T02:00:01.322Z","0.10.4":"2019-11-02T02:12:41.870Z","0.10.5-alpha.1":"2019-11-02T10:23:54.525Z","0.10.5-alpha.2":"2019-11-02T10:26:29.108Z","0.10.5-alpha.3":"2019-11-02T10:28:51.545Z","0.10.5-alpha.4":"2019-11-02T10:30:42.733Z","0.10.5-alpha.5":"2019-11-02T10:34:34.742Z","0.10.5-alpha.6":"2019-11-02T10:35:55.507Z","0.10.5-alpha.7":"2019-11-02T10:37:36.580Z","0.10.5-alpha.8":"2019-11-02T10:39:06.627Z","0.10.5-alpha.9":"2019-11-02T10:42:47.358Z","0.10.5-alpha.11":"2019-11-02T10:52:03.943Z","0.10.5-alpha.12":"2019-11-02T10:55:20.631Z","0.10.5-alpha.13":"2019-11-02T10:57:18.668Z","0.10.5-alpha.14":"2019-11-02T11:00:02.291Z","0.10.5-alpha.15":"2019-11-02T11:04:05.393Z","0.10.5-alpha.16":"2019-11-02T11:11:09.073Z","0.10.5-alpha.17":"2019-11-02T11:19:29.873Z","0.10.5-alpha.18":"2019-11-02T12:01:58.906Z","0.10.5-alpha.19":"2019-11-02T12:07:44.631Z","0.10.5-alpha.20":"2019-11-02T12:11:30.139Z","0.10.5-alpha.21":"2019-11-02T12:14:26.427Z","0.10.5-alpha.22":"2019-11-02T12:16:23.685Z","0.10.5-alpha.23":"2019-11-02T12:26:01.391Z","0.10.5-alpha.24":"2019-11-02T12:32:01.648Z","0.10.5-alpha.25":"2019-11-02T13:12:17.664Z","0.10.5-alpha.26":"2019-11-02T13:18:16.834Z","0.10.5-alpha.27":"2019-11-02T13:20:07.000Z","0.10.5-alpha.28":"2019-11-02T13:22:08.606Z","0.10.5-alpha.29":"2019-11-02T13:37:38.752Z","0.10.5-alpha.30":"2019-11-02T13:40:58.179Z","0.10.5-alpha.31":"2019-11-02T13:43:25.825Z","0.10.5-alpha.32":"2019-11-02T13:46:37.386Z","0.10.5-alpha.33":"2019-11-02T13:50:20.093Z","0.10.5-alpha.34":"2019-11-02T13:52:32.940Z","0.10.5-alpha.35":"2019-11-02T14:00:18.238Z","0.10.5-alpha.36":"2019-11-02T14:02:42.116Z","0.10.5-alpha.37":"2019-11-02T14:04:45.392Z","0.10.5-alpha.38":"2019-11-02T14:13:58.706Z","0.10.5-alpha.39":"2019-11-02T14:54:13.107Z","0.10.5-alpha.41":"2019-11-02T14:56:09.094Z","0.10.5-alpha.43":"2019-11-02T15:05:40.921Z","0.10.5-alpha.44":"2019-11-02T15:11:55.927Z","0.10.5-alpha.45":"2019-11-02T15:15:45.340Z","0.10.5-alpha.46":"2019-11-02T15:18:30.875Z","0.10.5-alpha.47":"2019-11-02T15:22:06.265Z","0.10.5-alpha.48":"2019-11-02T15:24:44.054Z","0.10.5-alpha.49":"2019-11-02T15:26:43.889Z","0.10.5-alpha.50":"2019-11-02T15:28:49.904Z","0.10.5-alpha.51":"2019-11-02T15:31:35.630Z","0.10.5-alpha.52":"2019-11-02T15:35:06.877Z","0.10.5-alpha.53":"2019-11-02T15:37:05.291Z","0.10.5-alpha.54":"2019-11-02T15:38:41.657Z","0.10.5-alpha.55":"2019-11-02T15:40:11.386Z","0.10.5-alpha.56":"2019-11-02T15:41:55.532Z","0.10.5-alpha.57":"2019-11-02T15:47:22.019Z","0.10.5-alpha.58":"2019-11-02T15:49:36.294Z","0.10.5-alpha.59":"2019-11-02T15:52:20.818Z","0.10.5-alpha.60":"2019-11-02T15:57:21.979Z","0.10.5-alpha.61":"2019-11-02T16:19:48.460Z","0.10.5-alpha.62":"2019-11-02T16:21:54.814Z","0.10.5-alpha.63":"2019-11-02T16:26:43.926Z","0.10.5-alpha.64":"2019-11-02T16:30:02.355Z","0.10.5-alpha.65":"2019-11-02T16:38:41.538Z","0.10.5":"2019-11-02T16:41:59.294Z","0.10.6-alpha.1":"2019-11-05T09:04:49.947Z","0.10.6-alpha.2":"2019-11-05T09:09:05.922Z","0.10.6-alpha.4":"2019-11-05T09:15:47.666Z","0.10.6":"2019-11-05T09:41:01.276Z","0.10.7":"2019-11-05T15:21:26.133Z","0.10.8":"2019-11-06T07:16:51.585Z","0.10.9-alpha.5":"2019-11-10T17:05:28.376Z","0.10.9-alpha.6":"2019-11-10T17:10:22.326Z","0.10.9":"2019-11-10T17:14:36.952Z","0.10.10-alpha.0":"2019-11-10T18:32:25.342Z","0.10.10-alpha.1":"2019-11-10T18:34:55.221Z","0.10.10-alpha.2":"2019-11-10T18:38:40.233Z","0.10.10-alpha.3":"2019-11-10T18:39:35.588Z","0.10.10-alpha.4":"2019-11-10T18:51:01.801Z","0.10.10-alpha.5":"2019-11-10T19:29:22.421Z","0.10.10-alpha.6":"2019-11-10T19:33:07.466Z","0.10.10-alpha.7":"2019-11-10T19:37:19.101Z","0.10.10-alpha.8":"2019-11-10T19:41:37.532Z","0.10.10-alpha.9":"2019-11-10T19:43:43.969Z","0.10.10-alpha.10":"2019-11-10T19:47:07.808Z","0.10.10-alpha.11":"2019-11-10T19:49:45.105Z","0.10.10-alpha.12":"2019-11-10T19:54:13.661Z","0.10.10-alpha.13":"2019-11-10T19:59:29.579Z","0.10.10-alpha.14":"2019-11-10T20:05:26.604Z","0.10.10-alpha.15":"2019-11-10T20:07:24.688Z","0.10.10-alpha.16":"2019-11-10T20:11:36.109Z","0.10.10-alpha.17":"2019-11-10T20:13:19.385Z","0.10.10-alpha.18":"2019-11-10T20:16:56.175Z","0.10.10-alpha.19":"2019-11-10T20:25:53.021Z","0.10.10-alpha.20":"2019-11-10T20:29:53.586Z","0.10.10-alpha.21":"2019-11-10T20:31:15.789Z","0.10.10-alpha.22":"2019-11-10T20:37:10.575Z","0.10.10-alpha.23":"2019-11-10T20:38:45.593Z","0.10.10-alpha.24":"2019-11-10T20:41:01.361Z","0.10.10-alpha.25":"2019-11-10T20:47:00.155Z","0.10.10-alpha.26":"2019-11-10T20:58:22.054Z","0.10.10-alpha.27":"2019-11-10T21:00:25.858Z","0.10.10-alpha.29":"2019-11-10T21:04:47.876Z","0.10.10-alpha.30":"2019-11-10T21:06:07.971Z","0.10.10-alpha.31":"2019-11-10T21:08:13.810Z","0.10.10-alpha.32":"2019-11-10T21:09:00.907Z","0.10.10-alpha.33":"2019-11-10T21:11:01.269Z","0.10.10-alpha.34":"2019-11-10T21:12:25.610Z","0.10.10-alpha.35":"2019-11-10T21:22:59.267Z","0.10.10-alpha.36":"2019-11-10T21:33:53.896Z","0.10.10-alpha.37":"2019-11-10T21:40:46.912Z","0.10.10-alpha.38":"2019-11-10T21:52:32.152Z","0.10.10-alpha.39":"2019-11-10T21:55:53.191Z","0.10.10-alpha.40":"2019-11-11T03:50:29.324Z","0.10.10-alpha.41":"2019-11-11T03:57:22.401Z","0.10.10-alpha.42":"2019-11-11T04:00:16.209Z","0.10.10-alpha.43":"2019-11-11T04:01:20.590Z","0.10.10-alpha.44":"2019-11-11T04:06:46.292Z","0.10.10-alpha.45":"2019-11-11T04:13:59.772Z","0.10.10-alpha.46":"2019-11-11T04:16:34.378Z","0.10.10-alpha.47":"2019-11-11T04:18:30.008Z","0.10.10-alpha.48":"2019-11-11T04:32:18.079Z","0.10.10-alpha.49":"2019-11-11T04:35:04.985Z","0.10.10-alpha.50":"2019-11-11T04:42:41.370Z","0.10.10-alpha.51":"2019-11-11T04:47:33.415Z","0.10.10-alpha.52":"2019-11-11T04:51:15.728Z","0.10.10-alpha.53":"2019-11-11T04:52:22.926Z","0.10.10-alpha.54":"2019-11-11T04:54:46.960Z","0.10.10-alpha.55":"2019-11-11T04:57:56.928Z","0.10.10-alpha.56":"2019-11-11T05:03:46.257Z","0.10.10-alpha.57":"2019-11-11T05:05:06.494Z","0.10.10-alpha.58":"2019-11-11T05:06:39.524Z","0.10.10-alpha.59":"2019-11-11T05:22:29.025Z","0.10.10-alpha.60":"2019-11-11T06:27:18.277Z","0.10.10-alpha.61":"2019-11-11T06:36:38.141Z","0.10.10-alpha.62":"2019-11-11T06:38:38.806Z","0.10.10-alpha.63":"2019-11-11T08:45:12.785Z","0.10.10-alpha.64":"2019-11-11T08:48:07.078Z","0.10.10-alpha.65":"2019-11-11T08:50:22.391Z","0.10.10-alpha.66":"2019-11-11T08:53:02.641Z","0.10.10-alpha.67":"2019-11-11T08:57:46.627Z","0.10.10-alpha.68":"2019-11-11T08:59:47.080Z","0.10.10-alpha.69":"2019-11-11T09:05:16.239Z","0.10.10-alpha.70":"2019-11-11T09:12:06.431Z","0.10.10-alpha.71":"2019-11-11T09:25:22.974Z","0.10.10-alpha.72":"2019-11-11T09:34:04.052Z","0.10.10-alpha.73":"2019-11-11T09:39:42.458Z","0.10.10-alpha.74":"2019-11-11T09:41:03.300Z","0.10.10-alpha.75":"2019-11-11T09:53:51.929Z","0.10.10-alpha.76":"2019-11-11T09:59:27.894Z","0.10.10-alpha.77":"2019-11-11T10:08:40.010Z","0.10.10-alpha.78":"2019-11-11T10:10:39.401Z","0.10.10-alpha.79":"2019-11-11T10:12:37.736Z","0.10.10-alpha.80":"2019-11-11T10:16:17.386Z","0.10.10-alpha.81":"2019-11-11T10:22:00.867Z","0.10.10-alpha.82":"2019-11-11T10:26:02.691Z","0.10.10-alpha.83":"2019-11-11T10:29:24.288Z","0.10.10-alpha.84":"2019-11-11T10:34:40.605Z","0.10.10-alpha.85":"2019-11-11T10:36:21.712Z","0.10.10-alpha.86":"2019-11-11T10:38:48.744Z","0.10.10-alpha.87":"2019-11-11T10:42:35.127Z","0.10.10-alpha.88":"2019-11-11T10:45:15.754Z","0.10.10-alpha.89":"2019-11-11T10:49:53.182Z","0.10.10-alpha.90":"2019-11-11T10:52:39.856Z","0.10.10-alpha.91":"2019-11-11T10:54:43.687Z","0.10.10-alpha.92":"2019-11-11T10:57:47.118Z","0.10.10-alpha.93":"2019-11-11T10:59:28.061Z","0.10.10-alpha.94":"2019-11-11T11:03:24.381Z","0.10.10-alpha.95":"2019-11-11T11:07:53.887Z","0.10.10-alpha.96":"2019-11-11T11:16:11.096Z","0.10.10-alpha.97":"2019-11-11T11:31:41.437Z","0.10.10-alpha.98":"2019-11-11T11:36:22.915Z","0.10.10-alpha.99":"2019-11-11T11:41:13.823Z","0.10.10-alpha.100":"2019-11-11T11:44:08.239Z","0.10.10-alpha.101":"2019-11-11T11:48:30.976Z","0.10.10-alpha.102":"2019-11-11T11:50:16.009Z","0.10.10-alpha.103":"2019-11-11T11:54:29.860Z","0.10.10-alpha.104":"2019-11-11T11:58:08.803Z","0.10.10-alpha.105":"2019-11-11T12:07:36.250Z","0.10.10-alpha.106":"2019-11-11T12:13:27.272Z","0.10.10-alpha.107":"2019-11-11T12:18:19.395Z","0.10.10-alpha.108":"2019-11-11T12:21:49.272Z","0.11.0":"2019-11-11T13:14:04.329Z","0.11.1-alpha.1":"2019-11-11T13:28:02.162Z","0.11.1-alpha.2":"2019-11-11T13:39:43.174Z","0.11.1-alpha.3":"2019-11-11T13:45:06.268Z","0.11.1-alpha.4":"2019-11-11T14:00:28.886Z","0.11.1-alpha.5":"2019-11-11T14:05:27.156Z","0.11.1-alpha.6":"2019-11-11T14:10:05.909Z","0.11.1-alpha.7":"2019-11-11T14:16:32.433Z","0.11.1":"2019-11-11T14:18:55.014Z","0.11.2-alpha.0":"2019-11-11T14:28:14.727Z","0.11.2-alpha.1":"2019-11-11T14:38:26.190Z","0.11.2-alpha.2":"2019-11-11T14:40:23.417Z","0.11.2-alpha.3":"2019-11-11T14:48:25.859Z","0.11.2-alpha.4":"2019-11-11T14:49:57.942Z","0.11.2-alpha.5":"2019-11-11T14:52:30.547Z","0.11.2-alpha.6":"2019-11-11T14:54:27.192Z","0.11.2-alpha.7":"2019-11-11T15:01:10.455Z","0.11.2-alpha.8":"2019-11-11T15:02:55.220Z","0.11.2-alpha.9":"2019-11-11T15:05:43.522Z","0.11.2":"2019-11-11T15:11:58.535Z","0.11.3-alpha.0":"2019-11-11T15:15:45.718Z","0.11.3-alpha.1":"2019-11-11T15:18:24.309Z","0.11.3-alpha.2":"2019-11-11T15:21:50.675Z","0.11.3-alpha.3":"2019-11-11T16:14:26.770Z","0.11.3-alpha.4":"2019-11-11T16:25:53.821Z","0.11.3-alpha.5":"2019-11-11T22:39:33.493Z","0.11.3-alpha.6":"2019-11-11T22:42:24.787Z","0.11.3-alpha.7":"2019-11-11T22:55:06.941Z","0.11.3-alpha.8":"2019-11-11T22:58:55.550Z","0.11.3-alpha.9":"2019-11-11T23:14:50.521Z","0.11.3-alpha.10":"2019-11-11T23:19:24.186Z","0.11.3-alpha.11":"2019-11-11T23:21:52.549Z","0.11.3-alpha.12":"2019-11-11T23:23:51.086Z","0.11.3-alpha.13":"2019-11-11T23:33:39.355Z","0.11.3-alpha.14":"2019-11-11T23:34:58.073Z","0.11.3-alpha.15":"2019-11-11T23:37:31.782Z","0.11.3-alpha.16":"2019-11-11T23:38:33.732Z","0.11.3-alpha.17":"2019-11-11T23:42:45.561Z","0.11.3-alpha.18":"2019-11-11T23:44:22.906Z","0.11.3-alpha.19":"2019-11-11T23:46:15.288Z","0.11.3-alpha.20":"2019-11-11T23:47:28.357Z","0.11.3-alpha.21":"2019-11-11T23:49:10.455Z","0.11.3-alpha.22":"2019-11-11T23:50:37.984Z","0.11.3-alpha.23":"2019-11-11T23:52:50.115Z","0.11.3-alpha.24":"2019-11-11T23:55:41.452Z","0.11.3-alpha.25":"2019-11-11T23:58:31.552Z","0.11.3-alpha.26":"2019-11-12T00:11:48.367Z","0.11.3-alpha.27":"2019-11-12T00:13:39.261Z","0.11.3-alpha.28":"2019-11-12T00:15:42.019Z","0.11.3-alpha.29":"2019-11-12T00:18:22.584Z","0.11.3-alpha.30":"2019-11-12T00:20:07.600Z","0.11.3-alpha.31":"2019-11-12T00:22:27.285Z","0.11.3-alpha.32":"2019-11-12T00:25:04.508Z","0.11.3-alpha.33":"2019-11-12T00:43:40.078Z","0.11.3-alpha.34":"2019-11-12T00:45:09.419Z","0.11.3-alpha.35":"2019-11-12T00:54:58.188Z","0.11.3-alpha.36":"2019-11-12T01:02:46.884Z","0.11.3-alpha.37":"2019-11-12T01:08:00.462Z","0.11.3-alpha.38":"2019-11-12T01:19:53.255Z","0.11.3-alpha.39":"2019-11-12T01:21:11.422Z","0.11.3-alpha.40":"2019-11-12T01:22:21.360Z","0.11.3-alpha.41":"2019-11-12T01:24:27.194Z","0.11.3-alpha.42":"2019-11-12T01:27:22.816Z","0.11.3-alpha.43":"2019-11-12T01:29:14.418Z","0.11.3-alpha.44":"2019-11-12T01:30:12.253Z","0.11.3-alpha.45":"2019-11-12T01:34:35.750Z","0.11.3-alpha.46":"2019-11-12T01:37:19.609Z","0.11.3-alpha.47":"2019-11-12T01:40:43.353Z","0.11.3-alpha.48":"2019-11-12T01:45:19.588Z","0.11.3-alpha.49":"2019-11-12T01:46:50.159Z","0.11.3-alpha.50":"2019-11-12T01:47:54.522Z","0.11.3-alpha.51":"2019-11-12T01:49:22.434Z","0.11.3-alpha.52":"2019-11-12T02:02:21.312Z","0.11.3-alpha.53":"2019-11-12T02:04:37.129Z","0.11.3-alpha.54":"2019-11-12T02:07:15.159Z","0.11.3-alpha.55":"2019-11-12T02:13:17.543Z","0.11.3-alpha.56":"2019-11-12T02:15:17.976Z","0.11.3-alpha.57":"2019-11-12T02:18:04.672Z","0.11.3-alpha.58":"2019-11-12T02:33:13.791Z","0.11.3":"2019-11-12T02:50:32.001Z","0.11.4-alpha.0":"2019-11-12T05:36:41.135Z","0.11.4-alpha.1":"2019-11-12T06:03:39.202Z","0.11.4-alpha.2":"2019-11-12T06:16:52.252Z","0.11.4-alpha.3":"2019-11-12T06:19:47.678Z","0.11.4-alpha.4":"2019-11-12T06:31:52.312Z","0.11.4-alpha.5":"2019-11-12T06:41:59.038Z","0.11.4-alpha.6":"2019-11-12T06:44:44.866Z","0.11.4-alpha.7":"2019-11-12T06:48:17.685Z","0.11.4-alpha.8":"2019-11-12T06:50:45.229Z","0.11.4-alpha.9":"2019-11-12T06:53:16.438Z","0.11.4-alpha.10":"2019-11-12T06:57:00.770Z","0.11.4-alpha.11":"2019-11-12T07:03:35.310Z","0.11.4-alpha.12":"2019-11-12T07:06:40.359Z","0.11.4-alpha.13":"2019-11-12T07:07:58.247Z","0.11.4-alpha.14":"2019-11-12T07:12:44.168Z","0.11.4-alpha.15":"2019-11-12T07:16:43.310Z","0.11.4-alpha.16":"2019-11-12T07:19:44.143Z","0.11.4-alpha.17":"2019-11-12T07:25:27.735Z","0.11.4-alpha.18":"2019-11-12T07:30:03.155Z","0.11.4-alpha.19":"2019-11-12T07:32:13.154Z","0.11.4-alpha.20":"2019-11-12T07:36:13.594Z","0.11.4-alpha.21":"2019-11-12T07:38:25.599Z","0.11.4-alpha.22":"2019-11-12T07:54:56.089Z","0.11.4-alpha.23":"2019-11-12T07:56:45.658Z","0.11.4-alpha.24":"2019-11-12T07:59:34.881Z","0.11.4-alpha.25":"2019-11-12T08:11:18.028Z","0.11.4":"2019-11-12T08:24:26.792Z","0.11.5-alpha.0":"2019-11-13T03:50:43.020Z","0.11.5-alpha.1":"2019-11-13T03:57:13.818Z","0.11.5-alpha.2":"2019-11-13T04:00:07.197Z","0.11.5":"2019-11-13T04:07:36.429Z","0.11.6-alpha.1":"2019-11-14T06:51:12.735Z","0.11.6-alpha.2":"2019-11-14T06:53:35.563Z","0.11.6-alpha.3":"2019-11-14T07:00:03.234Z","0.11.6-alpha.4":"2019-11-14T07:15:21.539Z","0.11.6-alpha.5":"2019-11-14T07:17:06.336Z","0.11.6-alpha.6":"2019-11-14T07:18:41.415Z","0.11.6-alpha.7":"2019-11-14T07:39:21.189Z","0.11.6-alpha.8":"2019-11-14T07:40:50.285Z","0.11.6-alpha.9":"2019-11-14T07:41:34.679Z","0.11.6-alpha.10":"2019-11-14T07:43:01.539Z","0.11.6-alpha.11":"2019-11-14T07:44:28.346Z","0.11.6-alpha.12":"2019-11-14T07:47:35.791Z","0.11.6-alpha.13":"2019-11-14T07:49:03.676Z","0.11.6-alpha.14":"2019-11-14T07:56:38.970Z","0.11.6-alpha.15":"2019-11-14T07:58:44.756Z","0.11.6-alpha.16":"2019-11-14T08:04:24.093Z","0.11.6-alpha.17":"2019-11-14T08:07:49.913Z","0.11.6-alpha.18":"2019-11-14T08:10:24.268Z","0.11.6-alpha.19":"2019-11-14T08:13:39.603Z","0.11.6-alpha.20":"2019-11-14T08:16:12.515Z","0.11.6-alpha.21":"2019-11-14T08:24:22.307Z","0.11.6-alpha.22":"2019-11-14T08:26:42.841Z","0.11.6-alpha.23":"2019-11-14T08:28:05.124Z","0.11.6-alpha.24":"2019-11-14T08:38:47.082Z","0.11.6-alpha.25":"2019-11-14T08:40:17.196Z","0.11.6-alpha.26":"2019-11-14T08:41:35.889Z","0.11.6-alpha.27":"2019-11-14T08:43:43.797Z","0.11.6-alpha.28":"2019-11-14T08:47:15.800Z","0.11.6-alpha.29":"2019-11-14T11:44:44.728Z","0.11.6-alpha.30":"2019-11-14T11:48:12.486Z","0.11.6-alpha.31":"2019-11-14T12:01:54.187Z","0.11.6-alpha.32":"2019-11-14T12:04:54.616Z","0.11.6-alpha.33":"2019-11-14T12:16:18.051Z","0.11.6-alpha.34":"2019-11-14T12:17:54.075Z","0.11.6-alpha.35":"2019-11-14T12:24:01.596Z","0.11.6-alpha.36":"2019-11-14T12:27:08.142Z","0.11.6-alpha.37":"2019-11-14T12:33:14.614Z","0.11.6-alpha.38":"2019-11-14T12:47:50.943Z","0.11.6-alpha.39":"2019-11-14T12:51:13.167Z","0.11.6-alpha.40":"2019-11-14T12:55:26.020Z","0.11.6-alpha.41":"2019-11-14T12:57:08.815Z","0.11.6-alpha.42":"2019-11-14T12:59:26.656Z","0.11.6-alpha.43":"2019-11-14T13:01:56.408Z","0.11.6-alpha.44":"2019-11-14T13:06:17.647Z","0.11.6-alpha.45":"2019-11-14T13:09:45.960Z","0.11.6-alpha.46":"2019-11-14T13:11:59.900Z","0.11.6-alpha.47":"2019-11-14T13:14:10.486Z","0.11.6-alpha.48":"2019-11-14T13:17:59.675Z","0.11.6":"2019-11-14T13:32:32.602Z","0.11.7-alpha.0":"2019-11-14T13:58:45.324Z","0.11.7-alpha.1":"2019-11-14T14:04:48.107Z","0.11.7-alpha.2":"2019-11-14T14:23:30.485Z","0.11.7":"2019-11-14T14:25:35.096Z","0.11.8-alpha.1":"2019-11-14T19:03:31.603Z","0.11.8-alpha.2":"2019-11-14T19:07:02.125Z","0.11.8-alpha.3":"2019-11-14T19:32:00.703Z","0.11.8-alpha.4":"2019-11-14T19:37:33.155Z","0.11.8-alpha.5":"2019-11-14T19:39:40.126Z","0.11.8":"2019-11-14T19:51:48.960Z","0.11.9":"2019-11-14T20:20:45.903Z","0.11.10-alpha.0":"2019-11-15T01:35:39.816Z","0.11.10-alpha.1":"2019-11-15T01:41:31.227Z","0.11.10":"2019-11-15T01:44:03.939Z","0.11.11-alpha.1":"2019-11-15T02:16:18.344Z","0.11.11-alpha.5":"2019-11-15T06:37:09.830Z","0.11.11-alpha.6":"2019-11-15T06:40:48.356Z","0.11.11-alpha.7":"2019-11-15T06:52:43.220Z","0.11.11-alpha.8":"2019-11-15T06:55:30.031Z","0.11.11-alpha.9":"2019-11-15T06:56:54.041Z","0.11.11-alpha.10":"2019-11-15T07:02:01.279Z","0.11.11-alpha.11":"2019-11-15T07:05:20.958Z","0.11.11-alpha.12":"2019-11-15T07:06:58.250Z","0.11.11-alpha.13":"2019-11-15T07:14:09.584Z","0.11.11":"2019-11-15T07:17:31.864Z","0.11.12-alpha.0":"2019-11-15T07:23:05.700Z","0.11.12-alpha.1":"2019-11-15T07:27:52.083Z","0.11.12-alpha.2":"2019-11-15T07:42:48.042Z","0.11.12-alpha.3":"2019-11-15T07:50:48.575Z","0.11.12-alpha.4":"2019-11-15T08:03:11.925Z","0.11.12":"2019-11-18T20:24:58.457Z","0.11.13":"2019-11-18T20:28:15.024Z","0.11.14":"2019-11-18T20:37:04.586Z","0.11.15-alpha.0":"2019-11-18T20:45:56.650Z","0.11.15-alpha.1":"2019-11-18T20:51:49.275Z","0.11.15-alpha.2":"2019-11-18T20:54:59.493Z","0.11.15-alpha.3":"2019-11-18T20:58:49.680Z","0.11.15-alpha.4":"2019-11-18T21:02:30.428Z","0.11.15-alpha.5":"2019-11-18T21:06:01.890Z","0.11.15":"2019-11-18T21:07:41.600Z","0.11.16":"2019-11-18T21:15:46.667Z","0.11.17":"2019-11-18T21:42:05.218Z","0.11.18":"2019-11-19T01:20:33.178Z","0.11.19-alpha.0":"2019-11-19T02:26:14.109Z","0.11.19-alpha.1":"2019-11-19T02:28:10.279Z","0.11.19-alpha.2":"2019-11-19T02:30:49.106Z","0.11.19-alpha.3":"2019-11-19T02:32:43.046Z","0.11.19-alpha.4":"2019-11-19T02:34:32.934Z","0.11.19-alpha.5":"2019-11-19T02:37:44.759Z","0.11.19-alpha.6":"2019-11-19T02:40:17.929Z","0.11.19-alpha.7":"2019-11-19T02:44:03.094Z","0.11.19-alpha.8":"2019-11-19T02:45:34.166Z","0.11.19-alpha.9":"2019-11-19T02:47:33.238Z","0.11.19-alpha.10":"2019-11-19T02:49:23.793Z","0.11.19-alpha.11":"2019-11-19T02:53:26.896Z","0.11.19-alpha.12":"2019-11-19T02:56:38.748Z","0.11.19-alpha.13":"2019-11-19T03:00:06.180Z","0.11.19-alpha.14":"2019-11-19T03:02:04.802Z","0.11.19":"2019-11-22T01:18:49.718Z","0.11.20-alpha.2":"2019-11-22T05:27:42.771Z","0.12.0":"2019-11-22T05:55:38.577Z","0.12.1":"2019-11-24T20:59:57.344Z","0.12.2":"2019-11-25T09:01:47.069Z","0.12.3-alpha.0":"2019-11-29T06:00:41.134Z","0.12.3-alpha.1":"2019-11-29T06:22:27.409Z","0.12.3-alpha.3":"2019-11-29T09:41:10.794Z","0.12.3":"2019-11-29T09:42:58.359Z","0.12.4-alpha.1":"2019-11-29T09:51:29.246Z","0.12.4":"2019-11-29T10:01:28.988Z","0.12.5-alpha.1":"2019-12-05T03:35:14.247Z","0.13.0":"2019-12-05T03:43:01.917Z","0.13.1-alpha.1":"2019-12-06T21:43:09.369Z","0.13.1-alpha.2":"2019-12-06T21:46:15.788Z","0.13.1-alpha.3":"2019-12-06T21:54:36.736Z","0.13.1-alpha.4":"2019-12-06T21:57:39.001Z","0.13.1-alpha.5":"2019-12-06T21:59:32.100Z","0.13.1-alpha.6":"2019-12-06T22:01:33.348Z","0.13.1-alpha.7":"2019-12-06T22:03:59.946Z","0.13.1-alpha.8":"2019-12-06T22:45:24.964Z","0.13.1-alpha.9":"2019-12-06T22:49:44.239Z","0.13.1-alpha.10":"2019-12-06T22:56:24.078Z","0.13.1-alpha.11":"2019-12-06T22:59:31.577Z","0.13.1-alpha.12":"2019-12-06T23:05:53.207Z","0.13.1-alpha.13":"2019-12-06T23:10:46.252Z","0.13.1-alpha.14":"2019-12-06T23:15:21.450Z","0.13.1-alpha.15":"2019-12-06T23:19:43.931Z","0.13.1-alpha.16":"2019-12-06T23:23:33.551Z","0.13.1-alpha.17":"2019-12-06T23:26:40.901Z","0.13.1-alpha.18":"2019-12-06T23:32:31.919Z","0.13.1-alpha.19":"2019-12-06T23:36:15.807Z","0.13.1-alpha.20":"2019-12-06T23:37:29.276Z","0.13.1-alpha.21":"2019-12-06T23:40:30.660Z","0.13.1-alpha.22":"2019-12-06T23:55:26.082Z","0.13.1-alpha.23":"2019-12-07T00:00:47.184Z","0.13.1-alpha.24":"2019-12-07T00:05:23.710Z","0.13.1-alpha.25":"2019-12-07T00:10:12.142Z","0.13.1-alpha.27":"2019-12-07T00:19:50.954Z","0.13.1-alpha.28":"2019-12-07T00:25:41.463Z","0.13.1-alpha.29":"2019-12-07T00:29:14.796Z","0.13.1-alpha.30":"2019-12-07T00:33:43.299Z","0.13.1-alpha.31":"2019-12-07T00:38:58.674Z","0.13.1-alpha.32":"2019-12-07T00:43:23.133Z","0.13.1-alpha.33":"2019-12-07T00:46:07.515Z","0.13.1-alpha.34":"2019-12-07T00:50:59.899Z","0.13.1-alpha.35":"2019-12-07T00:51:52.729Z","0.13.1-alpha.36":"2019-12-07T00:56:04.336Z","0.13.1-alpha.37":"2019-12-07T01:03:08.763Z","0.13.1-alpha.38":"2019-12-07T01:04:27.169Z","0.13.1-alpha.39":"2019-12-07T01:09:23.066Z","0.14.0":"2019-12-07T01:33:42.452Z","0.14.1-alpha.4":"2019-12-09T03:32:09.436Z","0.14.1-alpha.5":"2019-12-09T03:39:33.536Z","0.14.1-alpha.6":"2019-12-09T03:43:36.372Z","0.14.1-alpha.7":"2019-12-09T03:49:15.808Z","0.14.1-alpha.8":"2019-12-09T03:55:47.118Z","0.15.0":"2019-12-09T04:07:34.382Z","0.15.1-alpha.2":"2019-12-09T23:06:11.587Z","0.15.1-alpha.3":"2019-12-09T23:17:28.037Z","0.15.1-alpha.4":"2019-12-09T23:21:35.429Z","0.15.1-alpha.5":"2019-12-09T23:24:26.990Z","0.15.1-alpha.6":"2019-12-09T23:27:46.442Z","0.15.1-alpha.7":"2019-12-09T23:33:59.106Z","0.15.1-alpha.8":"2019-12-09T23:37:00.194Z","0.15.1-alpha.9":"2019-12-09T23:40:42.217Z","0.15.1":"2019-12-09T23:48:21.819Z","0.15.2-alpha.4":"2019-12-16T09:04:47.708Z","0.15.2-alpha.5":"2019-12-16T09:37:10.294Z","0.15.2":"2019-12-16T09:43:31.624Z","0.15.3-alpha.0":"2019-12-16T09:49:58.766Z","0.15.3-alpha.1":"2019-12-16T09:54:52.415Z","0.15.3-alpha.2":"2019-12-16T09:57:48.751Z","0.15.3":"2019-12-16T10:01:31.365Z","0.15.4-alpha.0":"2019-12-16T10:07:15.117Z","0.16.0":"2019-12-16T10:09:49.994Z","0.17.0":"2019-12-16T10:16:26.324Z","0.17.1":"2019-12-16T10:24:40.670Z","0.17.2":"2019-12-16T13:15:39.405Z","0.17.3":"2019-12-16T13:23:49.025Z","0.18.0":"2019-12-16T13:41:19.794Z","0.18.1":"2019-12-16T13:53:13.719Z","0.18.2":"2019-12-16T21:45:36.743Z","0.18.3-alpha.2":"2019-12-17T00:33:06.975Z","0.18.3-alpha.3":"2019-12-17T00:35:47.687Z","0.18.3-alpha.4":"2019-12-17T00:40:08.523Z","0.18.3-alpha.6":"2019-12-17T00:50:58.178Z","0.18.3":"2019-12-17T01:05:11.783Z","0.19.0-alpha.5":"2019-12-17T04:59:44.090Z","0.19.0":"2019-12-17T12:27:40.545Z","0.19.1":"2019-12-17T23:55:23.463Z","0.19.2":"2019-12-18T03:23:41.891Z","0.19.4-alpha.7":"2019-12-18T20:25:12.011Z","0.19.4":"2019-12-18T20:37:39.979Z","0.19.5":"2019-12-18T20:44:45.913Z","0.19.6":"2019-12-20T13:52:49.086Z","0.19.8-alpha.9":"2020-01-10T14:31:01.464Z","0.19.8":"2020-01-10T14:33:20.822Z","0.19.9":"2020-01-15T05:32:00.781Z","0.19.10-alpha.2":"2020-03-02T13:19:50.785Z","0.19.10":"2020-03-02T13:23:40.694Z","0.19.11-alpha.13":"2020-03-02T14:01:19.373Z","0.19.11":"2020-03-02T14:03:54.354Z","0.19.12-alpha.1":"2020-03-02T19:32:47.993Z","0.19.12-alpha.2":"2020-03-02T19:40:07.582Z","0.19.12-alpha.3":"2020-03-02T19:44:17.891Z","0.19.12":"2020-03-02T19:47:53.818Z","0.19.13-alpha.0":"2020-03-02T19:59:28.085Z","0.19.13-alpha.1":"2020-03-02T20:02:45.874Z","0.19.13":"2020-03-02T20:05:22.425Z","0.20.0":"2020-03-02T20:40:15.922Z","0.20.1-alpha.1":"2020-03-11T18:33:40.797Z","0.20.1-alpha.2":"2020-03-11T18:36:34.172Z","0.20.1":"2020-03-11T18:38:39.190Z","0.21.1-alpha.1":"2020-03-12T18:32:36.586Z","0.21.1-alpha.2":"2020-03-12T19:07:18.166Z","0.21.1-alpha.3":"2020-03-12T19:15:44.287Z","0.21.1":"2020-03-12T19:22:07.080Z","0.21.2-alpha.3":"2020-03-12T20:06:28.265Z","0.21.2-alpha.4":"2020-03-12T20:13:36.997Z","0.21.2-alpha.6":"2020-03-12T20:49:43.129Z","0.21.2-alpha.7":"2020-03-12T20:54:31.427Z","0.21.2":"2020-03-12T21:02:52.857Z","0.21.3-alpha.0":"2020-03-12T21:18:03.758Z","0.21.3-alpha.1":"2020-03-12T21:19:24.696Z","0.21.3-alpha.2":"2020-03-12T21:23:53.708Z","0.21.3-alpha.3":"2020-03-12T21:27:12.767Z","0.21.3-alpha.4":"2020-03-12T21:32:55.263Z","0.21.3-alpha.5":"2020-03-12T21:36:25.034Z","0.21.3-alpha.6":"2020-03-12T21:38:32.867Z","0.21.3-alpha.7":"2020-03-12T21:41:06.382Z","0.21.3":"2020-03-12T21:43:24.452Z","0.21.4-alpha.3":"2020-03-13T17:31:27.833Z","0.21.4-alpha.4":"2020-03-13T17:33:02.078Z","0.21.4":"2020-03-13T17:36:29.480Z","0.21.5-alpha.0":"2020-03-13T17:46:31.044Z","0.21.5-alpha.1":"2020-03-13T17:54:47.536Z","0.21.5-alpha.2":"2020-03-13T17:58:01.747Z","0.21.5-alpha.3":"2020-03-13T18:01:22.399Z","0.21.5-alpha.4":"2020-03-13T18:03:18.582Z","0.21.5-alpha.5":"2020-03-13T18:07:57.597Z","0.21.5-alpha.6":"2020-03-13T18:16:36.382Z","0.21.5-alpha.7":"2020-03-13T18:24:44.484Z","0.21.5-alpha.8":"2020-03-13T18:28:06.761Z","0.21.5-alpha.9":"2020-03-13T18:33:33.852Z","0.21.5-alpha.10":"2020-03-13T18:35:23.834Z","0.21.5-alpha.11":"2020-03-13T18:38:59.742Z","0.21.5-alpha.12":"2020-03-13T18:42:48.354Z","0.21.5-alpha.13":"2020-03-13T18:45:21.472Z","0.21.5-alpha.14":"2020-03-13T18:47:22.399Z","0.21.5-alpha.15":"2020-03-13T18:50:02.906Z","0.21.5":"2020-03-13T18:53:44.591Z","0.21.6":"2020-03-15T07:30:20.452Z","0.21.7-alpha.0":"2020-03-15T07:33:45.741Z","0.21.7-alpha.1":"2020-03-15T07:35:54.194Z","0.21.7-alpha.2":"2020-03-15T07:47:39.854Z","0.21.7":"2020-03-15T07:59:38.515Z","0.21.8-alpha.0":"2020-03-19T10:05:24.278Z","0.21.8-alpha.1":"2020-03-19T10:08:47.952Z","0.21.8-alpha.2":"2020-03-19T10:13:15.044Z","0.21.8-alpha.3":"2020-03-19T10:29:03.291Z","0.21.8-alpha.4":"2020-03-19T10:36:16.210Z","0.21.8-alpha.5":"2020-03-19T10:39:03.005Z","0.21.8":"2020-03-19T13:26:38.583Z","0.21.9-alpha.0":"2020-03-19T18:48:52.458Z","0.21.9-alpha.1":"2020-03-19T18:51:23.464Z","0.21.9-alpha.2":"2020-03-19T19:39:57.265Z","0.21.9":"2020-03-19T19:44:39.460Z","0.21.10-alpha.0":"2020-03-20T05:07:30.772Z","0.21.10-alpha.1":"2020-03-20T05:13:22.872Z","0.21.10-alpha.2":"2020-03-20T05:19:59.136Z","0.21.10-alpha.3":"2020-03-20T06:14:02.154Z","0.21.10-alpha.4":"2020-03-20T06:22:47.817Z","0.21.10-alpha.5":"2020-03-20T06:38:56.283Z","0.21.10-alpha.6":"2020-03-20T06:58:22.544Z","0.21.10-alpha.7":"2020-03-20T07:01:30.164Z","0.21.10-alpha.8":"2020-03-20T07:29:58.159Z","0.21.10-alpha.9":"2020-03-20T07:33:46.161Z","0.21.10-alpha.10":"2020-03-20T07:38:12.268Z","0.21.10-alpha.11":"2020-03-20T07:47:19.683Z","0.21.10":"2020-03-20T07:50:28.030Z","0.21.11-alpha.0":"2020-03-20T10:19:19.565Z","0.21.11":"2020-03-21T06:49:40.320Z","0.21.12-alpha.0":"2020-03-21T06:56:12.524Z","0.21.12-alpha.1":"2020-03-21T07:01:52.928Z","0.21.12-alpha.2":"2020-03-21T07:04:15.105Z","0.21.12-alpha.3":"2020-03-21T07:07:11.915Z","0.21.12":"2020-03-21T07:10:38.953Z","0.21.13":"2020-03-22T18:48:41.666Z","0.21.14-alpha.5":"2020-03-26T09:36:19.979Z","0.21.14":"2020-03-26T09:40:24.593Z","0.21.15-alpha.1":"2020-03-26T19:59:11.616Z","0.21.15-alpha.2":"2020-03-26T20:01:18.531Z","0.21.15-alpha.3":"2020-03-26T20:03:29.326Z","0.21.15-alpha.4":"2020-03-26T20:08:29.021Z","0.21.15-alpha.5":"2020-03-26T20:14:35.018Z","0.21.15-alpha.6":"2020-03-26T20:21:47.624Z","0.21.15-alpha.7":"2020-03-26T20:29:48.720Z","0.21.15-alpha.8":"2020-03-26T20:33:42.397Z","0.21.15-alpha.9":"2020-03-26T20:41:06.419Z","0.21.15-alpha.10":"2020-03-26T20:42:08.605Z","0.21.15-alpha.11":"2020-03-26T21:05:32.960Z","0.21.15-alpha.12":"2020-03-26T21:14:22.628Z","0.21.15":"2020-03-26T21:18:41.771Z","0.21.16":"2020-03-27T04:09:45.957Z","0.21.17-alpha.2":"2020-03-27T13:02:30.445Z","0.21.17":"2020-03-27T13:05:51.512Z","0.21.18":"2020-03-28T21:15:19.495Z","0.22.0":"2020-03-29T11:23:45.705Z","0.23.0":"2020-06-10T06:48:10.947Z","0.24.0":"2020-06-19T21:32:45.592Z","0.25.0-canary.0":"2022-09-01T13:52:00.017Z","0.25.0-canary.1":"2022-09-01T13:55:43.754Z","0.25.0-canary.2":"2022-09-01T14:00:19.264Z"},"maintainers":[{"name":"saltyshiomix","email":"shiono.yoshihide@gmail.com"}],"description":"React SSR as a view template engine","homepage":"https://github.com/saltyshiomix/react-ssr/tree/master/packages/nestjs-express/README.md","keywords":["react","nest","nestjs","express","server-side-rendering","ssr","view-engine","view-template-engine"],"repository":{"type":"git","url":"git+ssh://git@github.com/saltyshiomix/react-ssr.git"},"author":{"name":"Yoshihide Shiono","email":"shiono.yoshihide@gmail.com"},"bugs":{"url":"https://github.com/saltyshiomix/react-ssr/issues","email":"shiono.yoshihide@gmail.com"},"license":"MIT","readme":"","readmeFilename":""}